jQuery CSS()方法改变CSS样式

jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性。其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔。比如要改变链接颜色,可以这样编写代码:

.代码  

  1. $("#61dh a").css(‘color‘,‘#123456‘);
  2. //选择器‘$("#61dh a")’表示ID为‘#61dh’的元素下的所有链接。
  3. //.css(‘color’,‘#123456‘);表示把颜色设为‘#123456‘

如果需要改变多个样式属性,可先定义属性变量,然后直接赋值给css()方法。示例如下:ui框架分享

.代码  

  1. var mycss = {
  2. background: ‘#EEE‘,
  3. width: ‘478px‘,
  4. margin: ‘10px 0 0‘,
  5. padding: ‘5px 10px‘,
  6. border: ‘1px solid #CCC‘
  7. };
  8. $("#result").css(divcss);

上述代码先定义了一个CSS样式属性变量“mycss”,类似于建立一个外部CSS文件,之后通过css()方法,把属性赋给ID为‘#result‘的DIV。

另外jQuery提供的css()方法还可以查看某个元素的css属性值。例如查看链接的颜色,代码如下:

.代码  

  1. $("#61dh a").css("color")

你会发现,这与第一个例子相似,但是这里只传递一个参数(样式属性)。

最后要介绍的是如何设置鼠标划过后的链接样式(比如: 颜色),需要用到jQuery事件类方法 - hover()。值得注意的是,hover()方法需要定义两个函数,一个是鼠标划过时;另一个是鼠标划过后。具体方法如下: ui框架分享

.代码  

  1. $("#61dh a").css(‘color‘,‘#123456‘);
  2. $("#61dh a").hover(function(){
  3. $(this).css(‘color‘,‘#999‘);
  4. },
  5. function(){
  6. $(this).css(‘color‘,‘#123456‘);
  7. });
  8. //hover()方法的两个函数使用用逗号分隔

或许聪明的你已经注意到这种方法称不上简洁,呵呵,其实jQuery hover()方法不是用来改变CSS样式的。在实际运用中,建议使用添加/移出CSS的方法来改变鼠标划过的链接样式。

jQuery CSS()方法改变CSS样式

时间: 2024-10-18 05:50:21

jQuery CSS()方法改变CSS样式的相关文章

jQuery CSS()方法改变CSS样式实例解析

转自:http://www.jbxue.com/article/24588.html 分享一个jQuery入门实例:使用CSS()方法改变现有的CSS样式表,css()方法在使用上具有多样性.其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔.比如要改变链接颜色,可以这样编写代码: $("#61dh a").css('color','#123456');//选择器‘$("#61dh a")'表示ID为‘#61dh'的元素下的所有链接.//.css(‘

jQuery中添加/改变/移除改变CSS样式例子

在jquery中对于div样式操作我们会使用到CSS() removeClass() addClass()方法来操作了,下面我们就整理了几个例子大家一起来看看吧. CSS()方法改变CSS样式 css()方法在使用上具有多样性.其中有一种可接受两个输入参数:样式属性和样式值,两者之间用逗号分隔.比如要改变链接颜色,可以这样编写代码:  代码如下 复制代码 $("#61dh a").css('color','#123456');//选择器‘$("#61dh a")’表

JQuery:JQuery 中的CSS()方法

JQuery:CSS()方法jQuery css()方法:css()方法设置或返回被选元素的一个或多个样式属性.1.返回 CSS 属性如需返回指定的 CSS 属性的值,请使用如下语法:css("propertyname");下面的例子将返回首个匹配元素的 background-color 值:实例:$("p").css("background-color");代码如下: <!DOCTYPE html> <html lang=&q

.css()与.addClass()设置样式的区别

对于样式的设置,addClass与css方法两者之间有什么区别? 可维护性: .addClass()的本质是通过定义个class类的样式规则,给元素添加一个或多个类.css方法是通过JavaScript大量代码进行改变元素的样式 通过.addClass()我们可以批量的给相同的元素设置统一规则,变动起来比较方便,可以统一修改删除.如果通过.css()方法就需要指定每一个元素是一一的修改,日后维护也要一一的修改,比较麻烦 灵活性: 通过.css()方式可以很容易动态的去改变一个样式的属性,不需要在

jQuery 事件方法大全-超全的总结

jquery常用的事件: /* on off hover blur change click dblclick focus keydown keyup keypress mousedown resize scroll select submit */ 元素事件列表说明: 注:不带参数的函数,其参数为可选的 fn.jQuery不支持form元素的reset事件. 事件 描述 支持元素或对象 blur( ) 元素失去焦点 a, input, textarea, button, select, lab

JQuery 基础(一)样式篇

      jquery学习笔记 1.环境搭建 进入官方网站获取最新的版本 http://jquery.com/download/  ,这里需要注意 jQuery 分 2 个系列版本 1.x 与 2.x,主要的区别 在于 2.x 不再兼容 IE6.7.8 为移动端而优化,由于减少了一些代码,使得该版本比 jQuery 1.x 更小且更快. 如果开发者比较在意老版本 IE 用户,只能使用 jQuery 1.9 及之前的版本了.我们这本课程为了兼容性问题,使用的是 1.9 版本.jQuery 每一个

jQuery基础 - 改变CSS样式

jQuery提供css()的方法来实现嵌入式改变元素样式,css()方法在使用上具有多样性.其中一种接受两个输入参数:样式属性和样式值,它们之间用逗号分开.比如我们要改变链接颜色,我们可以使用下面的代码: $("#61dh a").css('color','#123456'); //这里选择器‘$("#61dh a")’表示ID为‘#61dh’的元素下的所有链接. //.css(‘color’,'#123456');表示把颜色设为'#123456' 如果我们需要改变

jQuery css() 方法:设置或返回被选元素的一个或多个样式属性

jQuery css() 方法 jQuery css() 方法 css() 方法设置或返回被选元素的一个或多个样式属性. 返回 CSS 属性 如需返回指定的 CSS 属性的值,请使用如下语法: css("propertyname"); 下面的例子将返回首个匹配元素的 background-color 值: 实例 $("p").css("background-color"); 设置 CSS 属性 如需设置指定的 CSS 属性,请使用如下语法: cs

jQuery css() 方法

jQuery css() Method css() 方法设置或返回被选元素的一个或多个样式属性. 返回 CSS 属性 如需返回指定的 CSS 属性的值,请使用如下语法: css("propertyname"); 下面的例子将返回首个匹配元素的 background-color 值: 实例 $("p").css("background-color"); 尝试一下 » 设置 CSS 属性 如需设置指定的 CSS 属性,请使用如下语法: css(&qu