jQuery 创建元素 - 另一个 .attr() 与 .prop() 问题 [重复]答案

【问题标题】：jQuery creating elements - another .attr() vs .prop() question [duplicate]jQuery 创建元素 - 另一个 .attr() 与 .prop() 问题 [重复]
【发布时间】：2011-08-18 15:11:50
【问题描述】：

可能重复：
.prop() vs .attr()

鉴于 jQuery 中的新 .prop() 方法，这是创建具有特定字段的新元素的首选方法，例如一个链接：

$('<a>').prop('href', '...');
$('<a>').attr('href', '...');
$('<a href="...">');

我一直倾向于使用#2，但目前还不清楚被放入 DOM 的 new 元素现在是否不应该使用 #1。

【问题讨论】：

不是重复的。链接的问题主要是关于属性和属性getters。这个问题完全是关于 setter 的，更具体地说是关于他们对新创建的 DOM 元素的应用。这个问题的答案只是在链接的页面上间接地解决了。
@BobStein-VisiBone 如果您有足够的代表，您可以投票重新开放，但我确实得到了我正在寻找的答案（下）
谢谢@Alnitak 我也有我的答案。只是为后代留下一个小费，而不是足够的代表重新打开（我认为是 3K）。

标签： jquery attributes

【解决方案1】：

在这种情况下，我会选择attr()。您正在创建一个新的<a> 元素并设置它的href HTML 属性，因此有必要强调这一点。

但是，由于href 属性直接映射到href DOM 属性，使用prop() 将得到完全相同的结果。

让我们再举一个例子，与attr() 和prop() 之间的区别更相关：假设您要设置<a> 元素的class 属性而不是它的href。您问题中的示例代码变为：

$('<a>').prop('className', '...');
$('<a>').attr('class', '...');
$('<a class="...">');

恕我直言，（2）和（3）使一个人的意图比（1）更清楚。不能有一个名为class 的DOM 属性，因为该标记可能是宿主语言中的保留字，这一事实充其量只是一个实现细节。 class HTML 属性通常是我们在这种情况下所考虑的。

当然，有些情况正好相反，例如使用“布尔”HTML 属性时，例如 checked 或 disabled。在这种情况下，设置强类型的 DOM 属性而不是创建定义不太明确的 HTML 属性会更加健壮。

【讨论】：

+1 详细解释而不是 why 而不仅仅是“因为我这么说”的答案

【解决方案2】：

我通常会像这样创建一个标签：

$('<a>', {href: '...'});

在开始时为元素添加尽可能多的属性。（是attributes，不是属性）

因此您可以对输入等项目执行相同的操作：

      $('<input>',{
                name: 'some_name',
                id: 'some_id',
                value: item_value,
                readonly: 'true',
                style: 'background: #eee;',
                size: 15
            });

或实际的 div：

      $('<div>',{
                id: 'some_id',
                text: 'this will be inside the div'
            });

这是一个小提琴示例：http://jsfiddle.net/maniator/mbjgd/

编辑
来自我下面的评论：

这样做的原因是因为当你创建项目时，你是通过设置它的属性来创建它的，后来这些属性在被 javascript 之类的东西更改时变得毫无意义，所以此时你必须使用对象的属性获得您可能正在寻找的真正解决方案。

【讨论】：

有趣 - 我不知道这种语法。
我一直使用它来定义许多对象，例如输入：$('<input>',{ name: item.name, id: item.id, value: item_value, readonly: 'true', style: 'background: #eee;', size: 15 });
@Alnitak，我通过帖子编辑以更好地向您展示。我也会加一个小提琴
谢谢，尽管在这种情况下我们仍然缺少一个合理的理由来解释为什么是属性而不是属性，而事实上人们现在似乎大多建议后者。
@Alnitak，这是在您创建项目时，您通过设置它的属性来创建它，后来当它们被 javascript 之类的东西更改时，这些属性变得毫无意义，所以那时你有使用对象的属性来获得您可能正在寻找的真正解决方案