所以jQuery 1.6有了新的功能prop()。
prop()
$(selector).click(function(){ //instead of: this.getAttribute('style'); //do i use: $(this).prop('style'); //or: $(this).attr('style'); })
或者在这种情况下他们做同样的事情吗?
如果我必须切换到 using ,如果我切换到 1.6 prop(),所有旧attr()电话都会中断?
attr()
更新
selector = '#id' $(selector).click(function() { //instead of: var getAtt = this.getAttribute('style'); //do i use: var thisProp = $(this).prop('style'); //or: var thisAttr = $(this).attr('style'); console.log(getAtt, thisProp, thisAttr); }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script> <div id='id' style="color: red;background: orange;">test</div>
(另见这个:http: //jsfiddle.net/maniator/JpUF2/)
控制台将 记录getAttribute为字符串,将记录attr为字符串,但将记录prop为CSSStyleDeclaration,为什么?这对我未来的编码有何影响?
getAttribute
attr
prop
CSSStyleDeclaration
我原来的答案专门适用于 jQuery 1.6。我的建议保持不变,但 jQuery 1.6.1 稍微改变了一些事情:面对预测的一堆损坏的网站,jQuery 团队恢复attr()到接近(但不完全相同)其旧的 Boolean attributes 行为。John Resig 也写了博客。我可以看到他们遇到的困难,但仍然不同意他选择的建议attr()。
原始答案
如果您只使用过 jQuery 而不是直接使用 DOM,这可能是一个令人困惑的变化,尽管它在概念上绝对是一个改进。但是对于使用 jQuery 的无数网站来说并不是那么好,这些网站会因为这种变化而崩溃。
我将总结主要问题:
checked
style
size
value
defaultValue
defaultChecked
如果您是 jQuery 开发人员并且对属性和属性的整个业务感到困惑,那么您需要退后一步并了解一点,因为 jQuery 不再努力保护您免受这些东西的影响。对于该主题的权威但有些干巴巴的词,有规范:DOM4,HTML DOM,DOM Level 2,DOM Level 3。Mozilla 的 DOM 文档适用于大多数现代浏览器,并且比规范更易于阅读,因此您可能会发现他们的DOM 参考很有帮助。有一个关于元素属性的部分。
作为属性比属性更容易处理的一个例子,考虑一个最初选中的复选框。以下是两个可能的有效 HTML 片段来执行此操作:
<input id="cb" type="checkbox" checked> <input id="cb" type="checkbox" checked="checked">
那么,如何确定复选框是否被 jQuery 选中?查看 Stack Overflow,您通常会发现以下建议:
if ( $("#cb").attr("checked") === true ) {...}
if ( $("#cb").attr("checked") == "checked" ) {...}
if ( $("#cb").is(":checked") ) {...}
这实际上是世界上与checked布尔属性有关的最简单的事情,自 1995 年以来,该属性在每个主要的可脚本浏览器中都存在并完美运行:
if (document.getElementById("cb").checked) {...}
该属性还使选中或取消选中复选框变得微不足道:
document.getElementById("cb").checked = false
在 jQuery 1.6 中,这明确地变成
$("#cb").prop("checked", false)
使用checked属性为复选框编写脚本的想法是无用且不必要的。该物业是您所需要的。
一个属性在 DOM 中;一个属性位于解析为 DOM 的 HTML 中。
更多细节 如果更改属性,更改将反映在 DOM 中(有时使用不同的名称)。
示例:更改class标签的属性将更改classNameDOM 中该标签的属性(这是因为class已使用)。如果标签上没有属性,则仍然有相应的 DOM 属性,其值为空或默认值。
示例:虽然您的标签没有class属性,但 DOM 属性className确实存在,但具有空字符串值。
编辑
如果您更改一个,另一个将由控制器更改,反之亦然。这个控制器不在 jQuery 中,而是在浏览器的本机代码中。