标签：元素属性 attr 节点 appendto 用户名 xixi 括号 name htm
一、元素属性
1、attr(name)
获取元素的属性。
$(".box").attr("title");
2、attr(key,value);
设置元素单个属性。
$(".box").attr("title","嘻嘻");
3、attr({key1:value1,key2:value2});
设置元素多个属性。
$(".box").attr({"title":"嘻嘻","id":"go"});
4、attr(key,function(index));
通过绑定方法设置元素的属性。
$(".box").attr("title",function(){
var a="嘻嘻";
return a;
})
5、removeAttr(name);
删除元素的单个属性。
$(".box").removeAttr("title");
6、removeAttr(name1 name2);
删除元素的多个属性。
$(".box").removeAttr("title id");
二、元素内容
1、html()
获取元素的html内容。
<div class="box"> <p class="one">我是第一段文字</p> <p class="two">我是第二段文字</p> </div> console.log($(".box").html()); //<p class="one">我是第一段文字</p> <p class="two">我是第二段文字</p>
2、html(value)
设置元素的html内容。
<div class="box"> <p class="one">我是第一段文字</p> <p class="two">我是第二段文字</p> </div> $(".box").html("<p>我只是一个新建的</p>"); <div class="box"> //变成了这样 <p>我只是一个新建的</p> </div>
3、text()
获得元素的文本内容。如果该元素有后代元素，则会把后代元素的文本内容一起获得。
<p class="one">我是第一段文字</p> <p class="two">我是第二段文字</p> console.log($(".one").text()); //我是第一段文字
4、text(value)
设置元素的文本内容。如果该元素有后代元素，则会被清除。
<p class="one">我是第一段文字</p> $(".box").text("今天星期四"); <p class="one">今天星期四</p> //现在变成了。 <div class="box"> <p class="one">我是第一段文字</p> <p class="two">我是第二段文字</p> </div> $(".box").text("今天星期四"); <p class="one">今天星期四</p> //子元素节点被清除了。
5、val()
获取value
$("input").val();
6、val(value);
设置vlaue
$("input").val("请输入您的用户名");
三、css
1、css(name,value);
设置单一的css样式。
$(".one").css("background-color","yellowgreen");
2、css({name1:value1,name2,value2})
设置多个css样式。
$(".one").css({
"background-color":"yellowgreen",
"border":"#000 solid 2px"
});
3、addClass(class)
增加一个class，注意，他还会保留原有的class
<p class="one">我是第一段文字</p> $(".one").addClass("xixi"); <p class="one xixi">我是第一段文字</p> //现在变成了。
4、toggleClass(class)
切换class，有则删除，无则添加。
$(".one").toggleClass("xixi");
5、removeClass(class);
删除一个class。
<p id="p" class="one xixi">我是第一段文字</p> $("#p").removeClass("xixi"); <p id="p" class="one">我是第一段文字</p> //已经删除了一个class
6、removeClass();
删除所有的class。
<p id="p" class="one xixi">我是第一段文字</p> $("#p").removeClass(); <p id="p" class="">我是第一段文字</p> //现在变成了
7、removeClass(class1 class2);
删除多个class，中间用空格隔开。
<p id="p" class="one xixi haha">我是第一段文字</p> $("#p").removeClass("xixi haha"); <p id="p" class="one">我是第一段文字</p> //现在变成了
四、节点
1、$(html)
创建节点。
var newP=$("<p>我只是一个新建的</p>"); //这样就创建了一个新节点，并把赋值个变量newP。
2、append(content)
插入节点，新建的节点 没有插入是看不到效果的，由父节点调用。
<div class="box"> <p id="p" class="one">我是第一段文字</p> </div> var newP=$("<p>我只是一个新建的</p>"); $(".box").append(newP); <div class="box"> //结构已经变了 <p id="p" class="one">我是第一段文字</p> <p>我只是一个新建的</p> </div>
这里还有一种情况，就是上面是我们新建的节点，如果要操作的是页面已有的节点呢。
<div class="box"> <p class="one">我是第一段文字</p> <p class="two">我是第二段文字</p> </div> $(".box").append($(".one")); <div class="box"> //其实就是移动了。 <p class="two">我是第二段文字</p> <p class="one">我是第一段文字</p> </div>
3、appendTo(content)
这个方法就是颠倒了append的位置，可以理解为插入到，父节点放到括号内，由要插入的节点的调用。
newP.appendTo($(".box"));
4、append(function(index,html));
将一个函数作为append方法的参数。
<div class="box"> <p class="one">我是第一段文字</p> </div> $(".box").append(function(){ return $("<p>我只是一个新建的</p>"); }); <div class="box"> //结构变成了 <p class="one">我是第一段文字</p> <p>我只是一个新建的</p> </div>
5、
标签：元素属性 attr 节点 appendto 用户名 xixi 括号 name htm
原文地址：http://www.cnblogs.com/xlj-code/p/6306002.html
