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);
}

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

“追溯（最近一次通话结束）：在assert（link.get_attribute（'id'）=='fancySheet'）的文件“ nt-test-3ed2ebdf.py”的第14行中，“ id”属性应设置为“ fancySheet”。实际：“'+ str（link.get_attribute（'id'））+'”' AssertionError：id属性应设置为“ fancySheet”。实际：“”“

Answer 1

在styleNum.setAttribute("href", "na_style_" + styleNum + .css);行中，将.css括在引号中，因为它是字符串而不是变量名。

styleNum.setAttribute("href", "na_style_" + styleNum + '.css');

window.addEventListener("load", setStyles);

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

Answer 2

您对两个变量使用了相同的名称。由于它们是使用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);
}

Answer 3

随机生成的数字应与元素节点分开存储在变量中。由于您将styleNum用作两个变量的名称，因此将首先生成一个随机数并将其存储在styleNum中，然后将创建新的元素节点，并在该随机生成的数字的正上方，由于变量无法存储，该数字将永远丢失两个不同的值。为了避免这种情况，并使随机数在函数中稍后使用，必须将要创建的元素节点命名为styleNum

以外的其他名称

以下是避免这种情况的代码示例：

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

还要注意我如何在最后一行的函数参数中在" "周围添加.css并将styleNum更改为styleElementNode。这是因为该函数旨在将创建的元素节点（而不是随机生成的数字）附加到文档头。

创建元素节点，设置其属性并追加元素？

3 个答案: