`

jquery方法之-css()返回或设置属性样式

 
阅读更多
返回指定的 CSS 属性的值语法：css("propertyname");
设置指定的 CSS 属性的值语法：css("propertyname","value");
设置多个 CSS 属性的语法：css({"propertyname":"value","propertyname":"value",...}); 

<script>
$(document).ready(function(){
  $("button").click(function(){
    <!--为所有匹配元素设置 background-color和 font-size-->
    $("p").css({"background-color":"yellow","font-size":"200%"});
    <!--返回首个匹配元素的 background-color 值-->
    alert("Background color = " + $("p").css("background-color"));
  });
});
</script>
</head>
<body>
<h2>这是标题</h2>
<p style="background-color:#ff0000">这是段落1。</p>
<p style="background-color:#00ff00">这是段落2。</p>
<p style="background-color:#0000ff">这是段落3。</p>
<p>这是段落4。</p>
<button>按钮请点我！</button>
</body>


另外jQuery 还有一系列的CSS 操作函数，还有:
height() 设置或返回匹配元素的高度。
width()         设置或返回匹配元素的宽度。
offset() 返回第一个匹配元素相对于文档的位置。
offsetParent() 返回最近的定位祖先元素。
position() 返回第一个匹配元素相对于父元素的位置。
scrollLeft() 设置或返回匹配元素相对滚动条左侧的偏移。
scrollTop() 设置或返回匹配元素相对滚动条顶部的偏移。
分享到：
| Oracle中Merge Into 代替Insert/Update的 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jQuery基础 - 改变CSS样式

    通过本文的学习，我们了解了如何使用jQuery的`css()`方法直接改变元素的样式属性，以及如何利用`hover()`方法处理鼠标悬停时的样式变化。这些技术在实际开发中非常有用，可以帮助开发者快速实现动态效果，提高用户...

    jquery-css3-404-page-code_page_404_jquery_

    6. **过渡（Transitions）**：平滑地改变一个或多个CSS属性，使飞蛾的运动更流畅。 此外，项目中的代码可能还包括HTML结构，用于放置飞蛾元素和可能的背景元素。这些HTML元素可能通过类名与jQuery和CSS3选择器相...

    jquery-easyui-1.3.6.zip

    jQuery EasyUI是一组基于jQuery的UI插件集合，而jQuery EasyUI的目标就是帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。开发者不需要编写复杂的javascript，也不需要对css样式有深入的了解，开发者需要了解...

    文件上传插件(jQuery-File-Upload)

    jQuery-File-Upload提供灵活的API和事件接口，开发者可以根据需求自定义界面样式、错误处理和上传逻辑。同时，它还支持与其他前端框架（如Bootstrap）和后端框架（如Rails、Django）的集成，适应不同开发环境。 ###...

    Jquery控制A标签Css样式

    4. **`.css()`**: 该方法用于获取或设置CSS属性。当以对象形式传入多个属性值时，会设置这些CSS属性；当只传入一个属性名时，会返回该属性的当前值。 5. **`.mousedown()`**: 当鼠标按钮被按下时触发此事件。 6. *...

    Jquery删除css属性的简单方法

    上述代码直接操作DOM元素，通过JavaScript原生的“style”属性来修改样式，效果与jQuery中的“.css()”方法相同，同样也是将对应的CSS属性值设置为空字符串，从而实现删除CSS属性的目的。这种方法不需要引入jQuery库...

    div css3样式表制作jquery返回顶部特效

    在网页设计中，"div css3样式表制作jquery返回顶部特效"是一个常见的需求，它能够提升用户体验，使得用户在浏览长页面时能快速返回页面顶部。这个主题涉及到三个主要技术：HTML的`div`元素、CSS3样式以及jQuery库。 ...

    jQuery-File-Upload页面上传框架

    3. **初始化插件**：在jQuery的`$(document).ready`事件中调用`$('#fileupload').fileupload()`方法来初始化插件。 4. **配置选项**：可以通过`.fileupload('option', {...})`设置各种选项，如URL、文件类型限制等。...

    jquery mobile 1.4.5demo和说明

    1. `jquery.mobile-1.4.5.css` 和 `.min.css`：主CSS文件，包含了jQuery Mobile的所有样式，未压缩和压缩版本。 2. `jquery.mobile.icons-1.4.5.css`：图标样式文件，提供了内置的图标集。 3. `jquery.mobile.inline...

    jquery css3曲线特效图.zip

    【jQuery CSS3曲线特效图】是一种利用jQuery库和CSS3技术构建的动态、交互式的曲线图形插件。这个插件允许开发者在网页中创建出视觉吸引力强、响应式的曲线效果，提升用户界面的互动性和美观度。以下是关于这个主题...

    jquery-api-1.8.chm

    5. **样式操作（Style Manipulation）**：`css()`方法可以用来设置或获取元素的样式属性，如颜色、尺寸等。`addClass()`, `removeClass()`和`toggleClass()`则用于管理元素的CSS类。 6. **动画（Animation）**：...

    jquery-easyui-1.5.5.5源码

    EasyUI 建立在jQuery之上，进一步封装了各种UI组件，如对话框、表格、树形视图、下拉菜单等，使得开发者无需编写复杂的CSS和JavaScript代码就能实现丰富的前端功能。 在"jquery-easyui-1.5.5.5源码"中，我们可以...

    jquery帮助文档--jquery帮助文档

    3. **CSS操作**：`css()`用于设置或获取元素的样式，`addClass()`和`removeClass()`用于添加或移除类。 4. **尺寸与位置**：`width()`和`height()`返回元素的宽度和高度，`offset()`获取元素相对于文档的位置。 5....

    jquery-1.8.3.min.js

    jQuery1.7.1不能正确地设置IE7中克隆元素的tabindex属性 压缩的JS文件包含非ASCII字符 如果body样式设置为display:none，则$（'body'）。show（）无法工作 在IE9中element.css（'filter'）返回不明确 在Android ...

    JQuery1.4.1

    - **属性和样式操作**: 新增了`attr()`和`css()`方法，用于方便地获取或设置元素的属性和样式。 - **事件处理**: 支持多种事件绑定，如 `click()`, `change()`, `hover()` 等，同时提供了 `live()` 方法实现事件...

    jQuery css() 方法动态修改CSS属性

    如果要一次设置多个样式属性，可以传递一个对象到 css() 方法中。对象的键为 CSS 属性名，值为希望设置的属性值。例如，若要将段落元素的背景颜色设置为黄色，字体大小设置为 200%，可以使用：$("p").css({...

    jQuery-1.6-api

    4. **CSS操作（CSS Manipulation）**：通过`.css()`方法，可以方便地获取或设置元素的CSS样式，如`$("#elem").css("color", "red")`将元素字体颜色设为红色。 5. **事件处理（Event Handling）**：jQuery简化了事件...

    jquery-ui-autocomplete

    4. **设置数据源**：`source`属性是关键，它可以是一个数组、函数或URL。如果是函数，需要接收请求和响应两个参数，用于处理请求并返回匹配的建议列表。 5. **自定义行为**：可以通过监听Autocomplete的事件，如`...

    jQuery-in-Action.part2.pdf

    - `$.support.style`: 如果浏览器支持CSS样式属性，则返回`true`。 这些标志帮助开发者编写更加兼容的代码，并在必要时应用补丁。 #### 6.2 与其他库的集成 jQuery设计之初就考虑到了与其他JavaScript库的兼容性...

    jquery插件--表格树--GridTree(20091011更新版本)(过期)

    - 引入必要的资源文件，包括GridTree.css、GridTree.js、jquery.js（jQuery库）以及其他可能需要的辅助脚本文件，如otherJs.js和myTestGridTree.js。 - 初始化GridTree，设置相关属性，如是否开启全选功能、分页参数...

Magicbox
Global site tag (gtag.js) - Google Analytics