| function | des | html | jquery | result |
| html() | 获取元素中HTML内容 | <div id="box" style="color:red"> <strong>www.ycku.com</strong> <p>www.ppp.com</p> </div> |
alert($(‘#box‘).html()); | <strong>www.ycku.com</strong> <p>www.ppp.com</p> |
| html(value) | 设置html内容,包裹在标签里面的内容会清空原来的数据，返回的是value的值 | <div id="box" style="color:red"> <strong>aaa</strong> <p>bbb</p> 111111 </div> |
alert($(‘#div‘).html(‘<em>aaa</em>‘)); | [object Object]--><em>aaa</em> |
| 追加数据 | $(‘#box‘).html($(‘#box‘).html() + ‘<em>www.li.cc</em>‘); | 在原来的基础上追加数据 | ||
| text() | 获取文本内容，会自动清理html标签 | <div id="box" style="color:red"> <strong>aaa</strong> <p>bbb</p> </div> |
alert($(‘#box‘).text()); | aaa bbb |
| text(value) | 设置文本内容，会自动转义html标签 | <div id="box" style="color:red"> <strong>aaa</strong> <p>bbb</p> 111111 </div> |
alert($(‘#div‘).html(‘<em>aaa</em>‘)); | [object Object] <em>aaa</em> |
| 通过匿名函数设置文本内容，会自动转义html标签 | <div id="box">55555</div> | $(‘div‘).text(function(index,value){ if (value!=‘确定‘){ return ‘确定‘; } }); |
(index是索引,value是原来的值)确定 | |
| val() | 获取表单内容，只能获取一个 | <input type="text" class="txt" value="确定" /> | alert($(‘.txt‘).val()); | 确定 |
| val(value) | 设置表单内容，可以获取多个对象 | <input type="text" class="txt" value="确定" /> | var tt=$(‘.txt‘).val(‘aaa‘); | 将"确定"设置为"aaa" |
| 设置单选按钮、复选框和下拉列框的值 | <input type="radio" value="男" />男 <input type="radio" value="女" />女 <input type="checkbox" value="编程" />编程 <select id="s1"> <option value="v1">text1</option> <option value="v2">text2</option> <option value="v3">text3</option> </select> |
$("input,#s1").val(["男","女","编程","v2"]); | 选中所有单选按钮、复选框和下列框的第二个值 | |
| attr(key) | 获取某个元素key 属性的属性值 | <input type="button" class="txt" value="确定" /> | alert($(‘input‘).attr(‘class‘)); | txt |
| attr(key, value) | 设置某个元素 key属性的属性值 | <input type="button" class="txt" value="确定" /> | $(‘input‘).attr(‘value‘,‘确定按钮‘); | 原来的"确定"改为"确定按钮" |
| attr({key1:value1, key2:value2...}) | 设置某个元素 多个key属性的属性值 | <input type="button" class="txt" value="确定" /> | $(‘input‘).attr({‘type‘:‘text‘,‘id‘:‘t1‘,‘class‘:‘123‘,‘value‘:‘确定按钮‘}); | 原来有的属性会被替换掉，没有的属性会增加上去 |
| attr(key, function (index, value) {}) | 通过匿名函数返回属性值,匿名函数里面可以写判断语句 | <input type="button" class="txt" value="确定" /> | $(‘input‘).attr(‘value‘,function(index,value){ if (value==‘确定‘){ return ‘确定按钮‘; } else { return ‘确定出错‘; } }); |
确定按钮 |
| removeAttr(key) | 删除指定的属性 | <input type="button" class="txt" value="确定" /> | $(‘input‘).removeAttr(‘value‘); | 删除了"确定"文字 |
| css(name) | 获取某个元素行内的 CSS 样式 | <div id="box" style="color:red"></div> | alert($(‘div‘).css(‘color‘)); | 谷歌：rgb(255, 0, 0) IE:red |
| css([name1, name2, name3]) | 获取某个元素行内多个CSS样式 | <div id="box" style="color:red;height:300px;width:350px;"></div> | var tt=$(‘div‘).css([‘color‘,‘height‘,‘width‘]); for(var i in tt){ alert(i+‘--‘+tt[i]); } |
循环遍历用for in将color、height和width的属性值按索引输出 |
| css(name, value) | 设置某个元素行内的CSS样式 | <div id="box">aaa</div> | $(‘#box‘).css(‘color‘,‘blue‘); | aaa变成红色 |
| css({name1 : value1, name2 : value2}) | 设置某个元素行内多个 CSS 样式，键值对 | <div id="box">AAA</div> | $(‘#box‘).css({‘color‘:‘blue‘,‘font-size‘:‘20px‘}); | AAA变成蓝色和字体变成20px |
| css(name, function (index, value) ) | 通过匿名函数设置某个元素行内的 CSS 样式 | <div id="box">AAA</div> | $(‘div‘).css(‘font-size‘,function(index,value){ if (value<‘20px‘){ return ‘30px‘; } }); |
AAA的字体变成30px |
| addClass(class) | 给某个元素添加一个 CSS 类 | <div id="box">55555</div> | $(‘div‘).addClass(‘aaa‘); $(‘.aaa‘).css(‘color‘,‘red‘); |
获取设置后的class并设置它的颜色为红色 |
| addClass(class1 class2 class3...) | 添加多个 CSS 类 | <div id="box">55555</div> | $(‘div‘).addClass(‘red bg‘); | div标签添加了class=red bg |
| removeClass(class) | 删除某个元素的一个 CSS 类 | <div id="box" class="bg">55555</div> | $(‘div‘).removeClass(‘bg‘); | 删除了class="bg" |
时间： 2024-10-24 18:37:33