属性方法
1.attr( name | pro | key,val |fn )读取或修改元素的属性值(行内)。
参数:
1.name:属性的名称。(用于读取值)
2.properties:作为属性的名称的对象。(用于修改多个属性)
3.key,value:属性名和属性值.(用于修改多个属性)
4.fn:回调函数。function(index,attr){}。index为元素队列中的索引值,attr为元素原来的属性值。
复制代码
1 $("img").attr("src");
2
3 $("img").attr({ src: "test.jpg", alt: "Test Image" });
4
5 $("img").attr("src","test.jpg");
6
7 $("img").attr("title", function() { return this.src });
复制代码
2.removeAttr( name )
移除属性。
参数:name。属性名称。
1 $("img").removeAttr("src");
3.prop(n | p | k,v | f )
读取或修改属性。该方法与attr方法类似,但该方法针对布尔类型的属性。
复制代码
1 $("input[type='checkbox']").prop("checked");
2 $("input[type='checkbox']").prop({
3 disabled: true
4 });
5
6 $("input[type='checkbox']").prop("checked", function( i, val ) {
7 return !val;
8 });
复制代码
4.removeProp(name)
移除属性。该方法所移除的属性不推荐默认属性。
1 var $para = $("p");
2 $para.prop("luggageCode", 1234);
3 $para.append("The secret luggage code is: ", String($para.prop("luggageCode")), ". ");
4 $para.removeProp("luggageCode");
5 $para.append("Now the secret luggage code is: ", String($para.prop("luggageCode")), ". ");
5.addClass(class | fn)
添加类名。
参数:
1.class:指定类名。多个使用空格分开。
2.function(index,class){}:函数,index为元素队列的索引值,class为要添加的类名。
1 $("p").addClass("selected");
2 $("p").addClass("selected1 selected2");
3
4 $('ul li:last').addClass(function() {
5 return 'item-' + $(this).index();
6 });
6.removeClass([class | fn])
该方法与添加类名方法类似。
复制代码
1 $("p").removeClass("selected");
2
3 删除匹配元素的所有类
4 $("p").removeClass();
5
6 删除最后一个元素上与前面重复的class
7 $('li:last').removeClass(function() {
8 return $(this).prev().attr('class');
9 });
复制代码
7.toggleClass(class | fn[,sw])
参数:
1.class:切换的类名。
2.class,switch:类名,用于决定元素是否包含class的布尔值
3.function(index,class,switch)[,switch]:函数,索引值,类名,布尔值。
复制代码
1 $("p").toggleClass("selected");
2
3 每点击三下加上一次 'highlight' 类
4 var count = 0;
5 $("p").click(function(){
6 $(this).toggleClass("highlight", count++ % 3 == 0);
7 });
8
9 根据父元素来设置class属性
10 $('div.foo').toggleClass(function() {
11 if ($(this).parent().is('.bar') {
12 return 'happy';
13 } else {
14 return 'sad';
15 }
16 });
复制代码
8.html(val | fn)
获取或修改html内容。
参数:
1.空:获取属性。
2.文本:修改内容为指定文本。
3.function(index,html){}:元素索引值,原来的html值。
复制代码
1 $('p').html();
2
3 $("p").html("Hello <b>world</b>!");
4
5 $("p").html(function(n){
6 return "这个 p 元素的 index 是:" + n;
7 });
复制代码
9.text(val | fn)
获取或修改元素的文本内容(不包括元素标签)
该方法与html方法类似。
复制代码
1 $('p').text();
2
3 $("p").text("Hello world!");
4
5 $("p").text(function(n){
6 return "这个 p 元素的 index 是:" + n;
7 });
复制代码
10.val([val | fn | arr ])
获取或修改元素的属性值。(行内)
复制代码
1 $("input").val();
2
3 $("input").val("hello world!");
4
5 $('input:text.items').val(function() {
6 return this.value + ' ' + this.className;
7 });
1.attr( name | pro | key,val |fn )读取或修改元素的属性值(行内)。
参数:
1.name:属性的名称。(用于读取值)
2.properties:作为属性的名称的对象。(用于修改多个属性)
3.key,value:属性名和属性值.(用于修改多个属性)
4.fn:回调函数。function(index,attr){}。index为元素队列中的索引值,attr为元素原来的属性值。
复制代码
1 $("img").attr("src");
2
3 $("img").attr({ src: "test.jpg", alt: "Test Image" });
4
5 $("img").attr("src","test.jpg");
6
7 $("img").attr("title", function() { return this.src });
复制代码
2.removeAttr( name )
移除属性。
参数:name。属性名称。
1 $("img").removeAttr("src");
3.prop(n | p | k,v | f )
读取或修改属性。该方法与attr方法类似,但该方法针对布尔类型的属性。
复制代码
1 $("input[type='checkbox']").prop("checked");
2 $("input[type='checkbox']").prop({
3 disabled: true
4 });
5
6 $("input[type='checkbox']").prop("checked", function( i, val ) {
7 return !val;
8 });
复制代码
4.removeProp(name)
移除属性。该方法所移除的属性不推荐默认属性。
1 var $para = $("p");
2 $para.prop("luggageCode", 1234);
3 $para.append("The secret luggage code is: ", String($para.prop("luggageCode")), ". ");
4 $para.removeProp("luggageCode");
5 $para.append("Now the secret luggage code is: ", String($para.prop("luggageCode")), ". ");
5.addClass(class | fn)
添加类名。
参数:
1.class:指定类名。多个使用空格分开。
2.function(index,class){}:函数,index为元素队列的索引值,class为要添加的类名。
1 $("p").addClass("selected");
2 $("p").addClass("selected1 selected2");
3
4 $('ul li:last').addClass(function() {
5 return 'item-' + $(this).index();
6 });
6.removeClass([class | fn])
该方法与添加类名方法类似。
复制代码
1 $("p").removeClass("selected");
2
3 删除匹配元素的所有类
4 $("p").removeClass();
5
6 删除最后一个元素上与前面重复的class
7 $('li:last').removeClass(function() {
8 return $(this).prev().attr('class');
9 });
复制代码
7.toggleClass(class | fn[,sw])
参数:
1.class:切换的类名。
2.class,switch:类名,用于决定元素是否包含class的布尔值
3.function(index,class,switch)[,switch]:函数,索引值,类名,布尔值。
复制代码
1 $("p").toggleClass("selected");
2
3 每点击三下加上一次 'highlight' 类
4 var count = 0;
5 $("p").click(function(){
6 $(this).toggleClass("highlight", count++ % 3 == 0);
7 });
8
9 根据父元素来设置class属性
10 $('div.foo').toggleClass(function() {
11 if ($(this).parent().is('.bar') {
12 return 'happy';
13 } else {
14 return 'sad';
15 }
16 });
复制代码
8.html(val | fn)
获取或修改html内容。
参数:
1.空:获取属性。
2.文本:修改内容为指定文本。
3.function(index,html){}:元素索引值,原来的html值。
复制代码
1 $('p').html();
2
3 $("p").html("Hello <b>world</b>!");
4
5 $("p").html(function(n){
6 return "这个 p 元素的 index 是:" + n;
7 });
复制代码
9.text(val | fn)
获取或修改元素的文本内容(不包括元素标签)
该方法与html方法类似。
复制代码
1 $('p').text();
2
3 $("p").text("Hello world!");
4
5 $("p").text(function(n){
6 return "这个 p 元素的 index 是:" + n;
7 });
复制代码
10.val([val | fn | arr ])
获取或修改元素的属性值。(行内)
复制代码
1 $("input").val();
2
3 $("input").val("hello world!");
4
5 $('input:text.items').val(function() {
6 return this.value + ' ' + this.className;
7 });