jquery 转载笔记(二) $属性操作(添加和删除) 分享
2013-06-10 17:25:59;  来源:网络;  作者:;  评论:0 点击:

本记: 7--12点7.index(subject) : 查找相应节点的位置,从0开始计数.如果没找到返回-1eg:<div id="foobar"><b></b><span id="foo"></s...

本记: 7--12点

7.index(subject) : 查找相应节点的位置,从0开始计数.如果没找到返回-1

eg:<div id="foobar"><b></b><span id="foo"></span></div>

$("*").index( $('#foobar')[0] ); ==>> 0
$("*").index( $('#foo')[0] );    ==>> 2
$("*").index( $('#bar')[0] );    ==>> -1

搜索选择.上例为搜索ID为foobar的元素,结果是此元素在第0个,从0开始,
foo在第二个,第1个元素为<b></b>,第三个bar因为没有ID是bar的,所以显示-1

 

8.length 返回节点的个数
eg:<img src="test1.jpg"/><img src="test2.jpg"/>
$("img").length; ==>> 2
统计选择.选择所有img元素,并统计个数.可用alert($("img").length);来输出调试
同样的方法还有
size()
$("img").size(); ==>> 2;
size()等同于length

 

9.lt(pos) 删除一个节点
eg:<p>This is just a test.</p><p>So is this</p>
$("p").lt(1); ==>> [<p>This is just a test.</p>]
删除一个元素或是节点使用lt,搜索所有p元素,删除第1个,起点为0,结果<p>So is this</p>被删除!

10.addClass 给一个element添加class可以添加多个
eg: <p>Hello</p>
$("p").addClass("selected"); ==>> [<p class="selected">Hello</p>]
$("p").addClass("selected highlight"); ==>> [<p class="selected highlight">Hello</p>]
添加Class,即是CSS样式,使用addClass

11.attr(name) 取得element的指定属性值
eg:<img src="test.jpg"/>
$("img").attr("src"); ==>>[test.jpg]
使用attr(name)来取得元素属性,name即为元素中的所有可用属性,比如img中的 src 属性.


attr(key,value) 设置属性attr(key,function) 调用相应的方法处理后的返回值用来设置属性attr(properties) 批量的设置element的属性值
eg: <img/>
$("img").attr({ src: "test.jpg", alt: "Test Image" }); ==>> [<img src="test.jpg" alt="Test Image"/>]
$("img").attr("src","test.jpg"); ==>> [<img src="test.jpg"/>]
设置元素属性,attr(key,value) key是指属性的名称,value是指导属性的值.可同时设置多个,比如例一,使用","来分隔!

以下两个方法等价:
$("img").attr("title", "${this.src}")
$("img").attr("title", function() {
    return this.src;
 })
==>> [<img src="test.jpg" title="test.jpg" />]
这个从了个this动作.${this.src}" 此变量为本身的src属性.
function() { //建立函数
    return this.src;  //返回结果值
 }
等于同${this.src}

12.html 取得element的html代码
eg: <div><input/></div>
$("div").html(); ==>> [<input/>];
选择div元素.得到div元素中间的html代码!

html(val) 设置element的html代码
eg: <div><input/></div>
$("div").html("<b>new stuff</b>"); ==>> [<div><b>new stuff</b></div>]
应该是搜索DIV的元素,把指定的HTML代码,替换其中!(原来DIV中的HTML代码就没了)

本文属转载文章,并不能保证完全正确,只供学习交流参考,版权归原作者所有。如果您认为有侵犯权利等不和法行为,请联系我们及时改正。http://www.zhuitaiyang.com/html/jsjquery/118.html

相关热词搜索:jquery 笔记 属性操作

上一篇:jquery 转载笔记(三) 元素的属性增加和删除操作
下一篇:jQuery 转载笔记(一)$选择器的用法

收藏
回到顶部