javascript - 创建元素节点、设置其属性并附加元素？

Question

我被指示为链接元素创建一个元素节点，并将其 rel 属性设置为“styleSheet”，将其 id 属性设置为“fancySheet”，并将其href 属性到“na_style_num.css”(其中 num 是 styleNum 变量的值)。

然后它要我将 fancySheet 样式元素附加到文档头部。

我觉得我真的离这里很近或很远。这是我在没有运气的情况下尝试过的:

na_styler.js:

window.addEventListener("load", setStyles);

function setStyles() {
   var styleNum = randInt(5);
   var styleNum = document.createElement("link");
   styleNum.setAttribute("rel", "stylesheet");
   styleNum.setAttribute("id", "fancySheet");
   styleNum.setAttribute("href", "na_style_" + styleNum + .css);
   document.head.appendChild(styleNum);
}

我收到了一些错误，但问题是它是以我无法真正理解的形式编写的。例如:

"追溯(最后一次调用):文件“nt-test-3ed2ebdf.py”，第 14 行，in assert(link.get_attribute('id') == 'fancySheet'), 'id 属性应设置为“fancySheet” .实际:"' + str(link.get_attribute('id')) + '"'AssertionError:id 属性应设置为“fancySheet”。实际:“”“

Answer 1

您为两个变量使用了相同的名称。因为它们是用 var 声明的，所以它不会抛出错误。第二个将覆盖第一个。

只需更改其中一个变量的名称

同时将 .css 包裹在 ""

中

window.addEventListener("load", setStyles);

function setStyles() {
   var styleNum = randInt(5);
   var styleElm = document.createElement("link");
   styleElm.setAttribute("rel", "stylesheet");
   styleElm.setAttribute("id", "fancySheet");
   styleElm.setAttribute("href", "na_style_" + styleNum + ".css");
   document.head.appendChild(styleElm);
}