属性
attr(name|pro|key,val|fn)
参数name 描述: 返回文档中所有图像的src属性值
jQuery代码
$("img").attr("src");
参数properties 描述: 为所有图像设置src和alt属性
jQuery代码
$("img").attr({ src: "test.jpg", alt: "Test Image" });
参数key,value 描述: 为所有图像设置src属性
jQuery代码
$("img").attr("src","test.jpg");
参数key,回调函数 描述: 把src属性的值设置为title属性的值
jQuery代码
$("img").attr("title", function() { return this.src });
removeAttr(name)
描述: 将文档中图像的src属性删除
HTML代码
<img src="test.jpg"/>
jQuery代码
$("img").removeAttr("src");
结果
[ <img /> ]
prop(name|properties|key,value|fn)
参数name 描述: 选中所有页面上的复选框(checked值设置为true)
jQuery代码
$("input[type='checkbox']").prop("checked");
参数properties 描述: 禁用页面上的所有复选框
jQuery代码
$("input[type='checkbox']").prop({
disabled: true
});
参数key,value 描述: 启用和选中所有页面上的复选框
jQuery代码
$("input[type='checkbox']").prop("disabled", false);
$("input[type='checkbox']").prop("checked", true);
参数key,回调函数 描述: 通过函数来反选所有页面上的复选框
jQuery代码
$("input[type='checkbox']").prop("checked", function( i, val ) {
return !val;
});
removeAttr(name)
描述: 设置一个段落数字属性,然后将其删除
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.
CSS类
addClass(class|fn)
参数class 描述: 为匹配的元素加上 'selected' 类
jQuery代码
$("p").addClass("selected");
$("p").addClass("selected1 selected2");
回调函数 描述: 给li加上不同的class
HTML代码
<ul>
<li>Hello</li>
<li>Hello</li>
<li>Hello</li>
</ul>
jQuery代码
$('ul li:last').addClass(function() {
return 'item-' + $(this).index();
});
removeClass([class|fn])
参数class 描述: 从匹配的元素中删除 'selected' 类
jQuery代码
$("p").removeClass("selected");
参数class 描述: 删除匹配元素的所有类
jQuery代码
$("p").removeClass();
回调函数描述: 删除最后一个元素上与前面重复的class
jQuery代码
$('li:last').removeClass(function() {
return $(this).prev().attr('class');
});
toggleClass(class|fn[,sw])
参数class 描述: 为匹配的元素切换 'selected' 类
jQuery代码
$("p").toggleClass("selected");
参数class,switch 描述: 每点击三下加上一次 'highlight' 类
jQuery代码
var count = 0;
$("p").click(function(){
$(this).toggleClass("highlight", count++ % 3 == 0);
});
回调函数 描述: 根据父元素来设置class属性
jQuery代码
$('div.foo').toggleClass(function() {
if ($(this).parent().is('.bar') {
return 'happy';
} else {
return 'sad';
}
});
HTML代码/文本/值
html([val|fn])
无参数 描述: 返回 p 元素的内容
jQuery代码
$('p').html();
参数val 描述: 设置所有 p 元素的内容
jQuery代码
$("p").html("Hello <b>world</b>!");
回调函数 描述: 使用函数来设置所有匹配元素的内容
jQuery代码
$("p").html(function(n){
return "这个 p 元素的 index 是:" + n;
});
text([val|fn])
无参数 描述: 返回 p 元素的文本内容
jQuery代码
$('p').text();
参数val 描述: 设置所有 p 元素的文本内容
jQuery代码
$("p").text("Hello world!");
回调函数 描述: 使用函数来设置所有匹配元素的文本内容
jQuery代码
$("p").text(function(n){
return "这个 p 元素的 index 是:" + n;
});
val([val|fn|arr])
无参数 描述: 获取文本框中的值
jQuery代码
$("input").val();
参数val 描述: 设定文本框的值
jQuery代码
$("input").val("hello world!");
回调函数 描述: 使用函数来设定文本框的值
jQuery代码
$('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"]);
结果
摘自 jQuery API 文档