Question

我试图弄清楚为什么createElement和appendChild不起作用。我相信我的代码是正确的，所以我不太清楚为什么它不起作用...（我使用的是IE 10）

CODE UPDATED

JavaScript文件：

var myObj = {

   firstName: "John",
   lastName: "Smith"
};

HTML文件：

<!DOCTYPE html />
<html>
<title>The Data Structure</title>
<body>

<script type="text/javascript" src="TheData.js">

var theElement = document.createElement('p');
var theText = document.createTextNode(myObj.firstName);
theElement.appendChild(theText);
document.body.appendChild(theElement);

</script>
</body>
</html>

Answer 1

您永远不会将theElement附加到文档中！最后再添加一行：

document.body.appendChild(theElement);

作为旁注，这是什么立即调用函数？

(function () {
return myObj.firstName;
}());

它什么都不做！

Answer 2

问题是，两者在src标记上提供script，在其中提供内容。这是无效的，你可以做其中一个，而不是两个。大多数浏览器都会使用src并忽略内容。

除此之外，创建元素不会将其放入DOM中。您必须将其添加到某处（通过appendChild或insertBefore或类似）。

所以也许：

<script src="TheData.js"></script>
<!-- Note: Two separate script elements -->
<script>
var theElement = document.createElement('p');
var theText = document.createTextNode(myObj.firstName);
theElement.appendChild(theText);
document.body.appendChild(theElement); // <==== Note: Adding `the Element` to the DOM
</script>

JavaScript中的createElement和appendChild

2 个答案: