jQuery（一）样式篇2 - 13337159127/Note GitHub Wiki

1.jQuery的属性与样式之.attr()与.removeAttr()：操作元素的特性 attr(“href”)：获取a标签 “href” 属性的值 attr("href","http://www.w3school.com.cn/jquery")：设置属性的值 $("input:first").attr('value','.attr( attributeName, value )')；找到第一个input，通过attr设置属性value的值 $("input:eq(1)").attr('value')； 找到第二个input，通过attr获取属性value的值 $("input:eq(3)").removeAttr('value')； 找到第四个input，通过使用removeAttr删除属性 2.jQuery的属性与样式之html()及.text()：读取、修改元素的html结构或者元素的文本内容 .html()方法 ：设置或返回所选元素的内容（包括 HTML 标记） .html( htmlString ) 设置每一个匹配元素的html内容(替换) $(".left div:first").html('整个div的子节点都被替换了'); 通过.html()方法替换html结构 .text()方法 ：设置或返回所选元素的文本内容 .text( textString ) 用于设置匹配元素内容的文本（添加） $(".left a:first").text('替换第一个a元素的内容'); 通过.text()方法替换文本内容 3.jQuery的属性与样式之.val() :处理表单元素的值， .val()无参数，val() 方法获得输入字段的值。获得元素属性value的值 .val( value )，设置匹配的元素集合中每个元素的值 $("p").text( $("#single").val()); 获取第一个元素的值 $("input[type='text']").val('修改表单的字段'); 选择一个表单，修改value的值 4.jQuery的属性与样式之增加样式.addClass() : 用于动态增加class类名 .addClass()方法不会替换一个样式类名。它只是简单的添加一个样式类名到元素上,设置样式 $('.left div').addClass('newClass'); class=left下div元素增加一个新的样式，增加背景颜色 5.jQuery的属性与样式之删除样式.removeClass() $('.left div').removeClass('newClass')； class=left下div元素删除newClass样式 6.jQuery的属性与样式之切换样式.toggleClass()；隔行换色 $("#table tr:odd").toggleClass("c"); 所有基数的样式保留，偶数的被删除 7.jQuery的属性与样式之样式操作.css() ：获取元素样式属性的计算值或者设置元素的CSS属性 .css( propertyName ) ：获取匹配元素集合中的第一个元素的样式属性的计算值(元素的颜色 字体大小) .css(propertyName, value )：设置CSS 8.jQuery的属性与样式之.css()与.addClass()设置样式的区别 .addClass与.css方法各有利弊，一般是静态的结构，都确定了布局的规则，可以用addClass的方法，增加统一的类规则 如果是动态的HTML结构，在不确定规则，或者经常变化的情况下，一般多考虑.css()方式