28

attr()作为一名 jQuery1.9+ 软件开发人员，我可以在日常工作中“弃用”该方法吗？

正如许多问题所示，

关于“使用 attr 还是使用 prop？”有很多困惑。，并且，根据我（开发人员）的观点，对于attr()方法的所有用途，我们可以prop改用：

  1. 向后兼容性：编码新软件不需要这个；
  2. 性能：John 说“通过 .attr() 方法访问属性将比直接通过 .prop() 访问属性稍慢”；
  3. 改变属性值：都可以通过prop(name,newvalue)方法改变。
  4. 移除属性：都可以通过removeProp(name)方法移除。
  5. 检查 HTML 属性值：浏览器使用 DOM，所有 HTML 都转换为 DOM，如果 DOM 受到影响，attr(name)方法也会受到影响。关于 prop 的“强类型”：它优于“html 字符串值”（例如“checked”与true）。
  6. 检查是否在“HTML 原始代码”中定义了一个属性（假设 attr浏览器中的该方法返回未定义，如果不是）... 那么，我们需要在某些软件中使用它吗？ 在 forms中，“.val() 方法是获取或设置表单值的推荐 jQuery 方法”
  7. 跨浏览器一致性：两者（不仅是 attr）都是一致的方法。（它是？？）。

所以，在这个时候（2013 年），我没有看到 attr在开发新的 jQuery 代码时使用方法的好理由......但是，换句话说，这是一个 问题：attr在我的日常任务？

4

4 回答 4

30

.attr()不被弃用，因为它对它的用途很有用，并且是做它的用途的唯一正确方法（缺少使用每个元素的getAttribute功能，它做同样的事情......或自己解析 HTML）。我们甚至进行此讨论的唯一原因是因为 jQuery（和一些旧浏览器（咳嗽IE咳嗽））错误地将属性和属性混为一谈，而这种混乱是他们在 1.9 中明显修复的问题。

.attr()检索属性，同时.prop()检索属性。两者是不同的东西，并且一直是正式的（尽管 DOM 通常具有对应于属性的属性）。如果您有<p whatever="value">, wherewhatever不是浏览器识别的属性，您将使用它.attr()来获取属性的值。 .prop()甚至无法在大多数浏览器中看到它。

当您关心生成的 DOM属性时，请使用.prop(). 当您关心实际的 HTML属性时，请使用.attr(). 这不是一个非此即彼的事情。您可以在相同的代码中同时使用两者，并且宇宙甚至不会内爆一次（假设您已经正确使用它们，无论如何）。:) 只需使用适合您当时正在做的工作的那个，并停止尝试“弃用”没有损坏的东西。

于 2013-02-25T15:23:59.297 回答
12

我冒昧地为你准备了一个小提琴：

http://jsfiddle.net/5REVP/

特别是这部分：

<div id="example" style="padding:10px"></div>

console.log("style");
var styleAttr = $("#example").attr("style");
console.log(styleAttr); // You get "padding:10px"
var styleProp = $("#example").prop("style");
console.log(styleProp); // You get a CSSStyleDeclaration object

“样式”示例清楚地表明属性与属性不同（检查控制台）。

为了可读性、可维护性和向后（以及向前）兼容性，您应该始终对给定任务使用正确的方法，否则方法可能会停止像您一样运行，.attr() 方法是的例子。

.attr() 方法用于获取元素的属性，属性是一个SGML术语，指的是元素标签中包含的信息，您可以通过检查元素轻松读取该信息。

  • 如果您获得元素的“样式”属性，则除了该属性中专门写入的信息之外，您将不会获得任何信息。
  • 如果您获得复选框的“已选中”属性，您将获得“已选中”或“”。

.prop() 方法用于获取元素的 DOM 属性。

  • 如果你得到了“style”属性，你没有得到设计师在 style 属性中写的东西，你得到了元素的所有实际 css 属性。
  • 如果您获得复选框的“选中”属性，您将得到真或假。
于 2013-02-25T15:43:48.510 回答
2

.attr() 仅访问 HTML 属性，而 .prop() 将检索不在 HTML 元素上的属性。请参阅文档：

例如，应使用 .prop() 方法检索和设置 selectedIndex、tagName、nodeName、nodeType、ownerDocument、defaultChecked 和 defaultSelected。在 jQuery 1.6 之前，可以使用 .attr() 方法检索这些属性，但这不在 attr 的范围内。这些没有对应的属性，只是属性。

http://api.jquery.com/prop/

于 2013-02-25T15:27:28.847 回答
0

我的功课...在阅读了@cHao 和@cernunnos 很好的解释之后，并在使用了几个月后...我认为我们需要另一个概念来决定，作为程序员，何时使用或不使用 prop 和 attr：

  • HTML 源代码及其表示：浏览器在浏览器的内存空间中加载 HTML 页面。好吧，留在内存浏览器的是 DOM 表示，但 DOM 保留了一些原始的东西，如属性和cssText 属性，它们是“有时持久的表示”。
    PS：没有在“标准 DOM”中定义的属性，没有到DOM 属性的映射。当一个（非只读）属性发生变化时，如果有对应的（映射的）属性，则可以自动更改。

  • DOM 状态：动态页面需要直接在 DOM 上进行更改，这是最终用户看到的。所以，如果页面上有一些“点击和更改”的动作，那么每次 DOM 都会去一个新的页面表示，所以，每次 DOM 都有一个新的状态。
    当一个DOM属性更改时，所有其他 DOM属性（如果需要）会一致更改。

考虑到这些概念，我们可以画出一条“经验法则（for attrvs propuses）”：

  1. 使用prop，你有 90% 的机会可以工作……如果你使用 jQuery 来改变 DOM 状态（和标准的 DOM假设），则有 99% 的机会。
  2. 如果您需要更改或访问data-*属性，请使用.data()方法。
  3. 否则（非 DOM、非数据或非标准事物）检查是否使用案例.attr()，并预留一些时间研究它（参见上面的答案）。
于 2013-07-15T13:36:56.820 回答