jQuery教程(2)-操作DOM之DOM元素属性

文章标签: jquery,jquery-dom
2014-12-27 15:58:38     13 人阅读    

DOM元素属性
我们曾在前面简单提到过,HTML属性与DOM属性有一点区别。HTML属性是指页面标记中 放在引号中的值,而DOM属性则是指通过JavaScript能够存取的值。如图5-2所示,通过Chrome 的开发人员工具可以看到HTML属性和DOM属性值。

 


          在Chrome开发人员工具的Elements检查器中,可以清楚地看到<p>元素有一个名为class的 属性,值为square。而在右侧面板中,这个属性有一个对应的DOM属性,名为className,值 也是square。这种HTML属性与对应的DOM属性名字不相同的情况并不多,而这里就是一个
例子。
         大多数情况下,HTML属性与对应的DOM属性的作用都是一样的,jQuery可以帮我们处理名 字不一致的问题。可是,有时候我们的确需要留意这两种属性的差异。某些DOM属性,例如 nodeName、nodeType、selectedIndex和childNodes,在HTML中没有对应的属性,因此通 过.attr()方法就没有办法操作它们。此外,数据类型方面也存在差异,比如HTML中的checked 属性是一个字符串,而DOM中的checked属性则是一个布尔值。对于布尔值属性,最后是测试 DOM属性而不是HTML属性,以确保跨浏览器的一致行为。
        在jQuery中,可以通过.prop()方法取得和设置DOM属性:

//取得"checked"属性的当前值
var currentlyChecked = $('.my-checkbox').prop('checked');
//设置"checked"属性的值
$('.my-checkbox').prop('checked', false);

这个.prop()方法与.attr()方法没有什么不同,比如它们都可以一次性接受一个包含多个 值的对象,也支持值回调函数。


原文地址:http://www.itmmd.com/201412/395.html
该文章由 萌萌的IT人 整理发布,转载须标明出处。

jQuery教程(3)-操作DOM之表单控件的值   上一篇
下一篇  Java程序常用算法 判断网页请求和 FTP 请求

精彩回复
发表评论
姓名:       

《程序员app》专门为程序员量身定做!