如何使用 setAttribute 将回调中的值添加到新元素中？

Question

我需要将回调的值添加到我的 setAttribute 中。我怎么做？

这个值是稍后从表中取出数据所必需的。

这是代码：

row.forEach(function(row) {
         var subchapname = document.createElement("div");
         subchapname.setAttribute("id", "subchaptertitle");
         subchapname.setAttribute("subid", '"+row+"');
         subchapname.setAttribute("onclick","{ alert('You are not going to believe this!') } ");
         subchapname.textContent = row.subname;
         rows.appendChild(subchapname);

基本上，这意味着： 回调 = 行

这个回调需要添加到subchapname.setAttribute("subid", '"+row+"');

这可能吗？

这是实际结果：

<div id="subchaptertitle" subid="&quot;+row+&quot;" onclick="{ alert('You are not going to believe this!') } ">bos in brand</div>```

Answer 1

subid 不是在其中存储数据的属性，因此您不能将这样的属性添加到 html-tag 并用值填充它（当然，将字符串写入其中会起作用，但这就是您需要？）。但是如果你使用 html5，你可以添加数据集。因此，使用此解决方案将您的行值存储在 subid 的数据集属性中。 如果 row 是一个对象，并且您想查看 Object 的字符串化值，请在将其存储到数据集中之前使用 JSON.stringify

row.forEach(function(row) {
  var subchapname = document.createElement("div");
  subchapname.setAttribute("id", "subchaptertitle");
  subchapname.dataset.subid = row;
  // subchapname.dataset.subid = JSON.stringify(row);
  subchapname.setAttribute("onclick","{ alert('You are not going to believe this!') } ");
  subchapname.textContent = row.subname;
  rows.appendChild(subchapname);
});

您的元素现在应该如下所示：

<div id="subchaptertitle" onclick="{ alert('You are not going to believe this!') } " data-subid="[object Object]"></div>

或者如果你使用了 JSON.stringify：

<div id="subchaptertitle" onclick="{ alert('You are not going to believe this!') } " data-subid="what ever row is as a string"></div>

要将值记录到控制台，（在将标签添加到 DOM 之后）执行以下操作：

console.log(document.getElementById('subchaptertitle').dataset.subid);

如果您使用 JSON.stringify，现在使用类似这样的内容：

console.log(JSON.parse(document.getElementById('subchaptertitle').dataset.subid));