1、attr(name|properties|key,value|fn)
参数name 描述: 返回文档中所有图像的src属性值。 $("img").attr("src"); 参数properties 描述: 为所有图像设置src和alt属性。 $("img").attr({ src: "test.jpg", alt: "Test Image" }); 参数key,value 描述: 为所有图像设置src属性。 $("img").attr("src","test.jpg"); 参数key,回调函数 描述: 把src属性的值设置为title属性的值。 $("img").attr("title", function() { return this.src });
2、removeAttr(name)
注意:1.6以下版本在IE6使用JQuery的removeAttr方法删除disabled是无效的。解决的方法就是使用$("XX").prop("disabled",false);
1.7版本在IE6下已支持删除disabled。
将文档中图像的src属性删除 HTML 代码: <img src="test.jpg"/> jQuery 代码: $("img").removeAttr("src"); 结果: [ <img /> ]
3、prop(name|properties|key,value|fn) 获取在匹配的元素集中的第一个元素的属性值。
参数name 描述: 选中复选框为true,没选中为false $("input[type='checkbox']").prop("checked"); 参数properties 描述: 禁用页面上的所有复选框。 $("input[type='checkbox']").prop({ disabled: true }); 参数key,value 描述: 禁用和选中所有页面上的复选框。 $("input[type='checkbox']").prop("disabled", false); $("input[type='checkbox']").prop("checked", true); 参数key,回调函数 描述: 通过函数来设置所有页面上的复选框被选中。 $("input[type='checkbox']").prop("checked", function( i, val ) { return !val; });
4、removeProp(name) 用来删除由.prop()方法设置的属性集
设置一个段落数字属性,然后将其删除。 HTML 代码: <p> </p> jQuery 代码: var $para = $("p"); $para.prop("luggageCode", 1234); $para.append("The secret luggage code is: ", String($para.prop("luggageCode")), ". "); $para.removeProp("luggageCode"); $para.append("Now the secret luggage code is: ", String($para.prop("luggageCode")), ". "); 结果: The secret luggage code is: 1234. Now the secret luggage code is: undefined.
5、addClass(class|fn) 为每个匹配的元素添加指定的类名。
//回调函数
给li加上不同的class HTML 代码: <ul> <li>Hello</li> <li>Hello</li> <li>Hello</li> </ul> jQuery 代码: $('ul li:last').addClass(function() { return 'item-' + $(this).index(); });
6、removeClass([class|fn]) 从所有匹配的元素中删除全部或者指定的类。
回调函数描述:
删除最后一个元素上与前面重复的class
HTML 代码:
<ul>
<li>Hello</li>
<li>Hello</li>
<li>Hello</li>
</ul>
jQuery 代码:
$('li:last').removeClass(function() {
return $(this).prev().attr('class');
});
7、toggleClass(class|fn[,sw]) 如果存在(不存在)就删除(添加)一个类。
参数class 描述: 为匹配的元素切换 'selected' 类 $("p").toggleClass("selected"); 参数class,switch 描述: 每点击三下加上一次 'highlight' 类 HTML 代码: <strong>jQuery 代码:</strong> jQuery 代码: var count = 0; $("p").click(function(){ $(this).toggleClass("highlight", count++ % 3 == 0); });
回调函数 描述: 根据父元素来设置class属性 $('div.foo').toggleClass(function() { if ($(this).parent().is('.bar') { return 'happy'; } else { return 'sad'; } });
8、html([val|fn]) 取得第一个匹配元素的html内容。这个函数不能用于XML文档。但可以用于XHTML文档。
无参数 描述: 返回p元素的内容。 $('p').html(); 参数val 描述: 设置所有 p 元素的内容 $("p").html("Hello <b>world</b>!"); 回调函数描述: 使用函数来设置所有匹配元素的内容。 $("p").html(function(n){ return "这个 p 元素的 index 是:" + n; });
9、text([val|fn]) 取得所有匹配元素的内容。
返回p元素的文本内容。 $('p').text(); 参数val 描述: 设置所有 p 元素的文本内容 $("p").text("Hello world!"); 回调函数 描述: 使用函数来设置所有匹配元素的文本内容。 $("p").text(function(n){ return "这个 p 元素的 index 是:" + n; });
10、val([val|fn|arr]) 获得匹配元素的当前值。
无参数 描述: 获取文本框中的值 $("input").val(); 参数val 描述: 设定文本框的值 $("input").val("hello world!"); 回调函数 描述: 设定文本框的值 $('input:text.items').val(function() { return this.value + ' ' + this.className; }); 参数array 描述: 设定一个select和一个多选的select的值 HTML 代码: <select id="single"> <option>Single</option> <option>Single2</option> </select> <select id="multiple" multiple="multiple"> <option selected="selected">Multiple</option> <option>Multiple2</option> <option selected="selected">Multiple3</option> </select><br/> <input type="checkbox" value="check1"/> check1 <input type="checkbox" value="check2"/> check2 <input type="radio" value="radio1"/> radio1 <input type="radio" value="radio2"/> radio2 jQuery 代码: $("#single").val("Single2"); $("#multiple").val(["Multiple2", "Multiple3"]); $("input").val(["check2", "radio1"]);