Question

在这里，javascript使用DOM SCRIPTING生成浏览器显示的最后一行，内容为：“No Finds”。假设我希望在“Finds”这个词之后并置一个来自font-awesome（fontawesome）的“标志性人物”，例如他们的笑脸。

我尝试了这个字符串：

<i class = 'fa fa-smile-o'></i>

在“No Finds”之后，如下所示，但这不起作用。

这是有效的代码：

newrow = makeEle({ tag: "tr", dom: [makeEle({ tag: "td", id: "tdWhere", dom: [document.createTextNode("No Finds")] })] });

这是我的补充 - 失败了：

newrow = makeEle({ tag: "tr", dom: [makeEle({ tag: "td", id: "tdWhere", dom: [document.createTextNode("No Finds<i class = 'fa fa-smile-o'></i>")] })] });

如何让CSS（字体真棒）在这里产生影响？我真的不懂javascript和CSS界面，所以我可能会要求不可能的。

通过以下正确编码解决了上述问题（感谢Michal）：

newrow = makeEle({ tag: "tr", dom: [ makeEle({ tag: "td", dom: [document.createTextNode(" No Finds "), makeEle({ tag: "i", className: "fa fa-frown-o" }) ] }) ] });

Answer 1

将班级设为fa fa-smile-o。

var i = document.createElement("i");
i.className = 'fa fa-smile-o';

Answer 2

由于字体很棒的标记是HTML而不仅仅是文本，document.createTextNode函数不起作用。因此，您必须使用makeEle来生成i标记节点。这是代码的样子（为了便于阅读，我将其拆分为多行）：

newrow = makeEle({
  tag: "tr",
  dom: [
    makeEle({
      tag: "td",
      id: "tdWhere",
      dom: [
        document.createTextNode("No Finds"),
        makeEle({
          tag: "i",
          className: "fa fa-smile-o"
        })
      ]
    }),
  ]
});

请注意makeEle的{{1}}数组内的额外dom次调用。

请参阅here for a demo on jsfiddle

如何将字体很棒的CSS嵌入到DOM脚本（javascript）中？

2 个答案: