Question

当我们使用document.getElementsByTagName("body")[0]时，浏览器中发生了什么过程。我有以下代码要执行。当我们在<script type="javascript" src=""myJs.js"></script>中的某个地方使用<body> or <head>时，流量有什么不同。

function addJavascript(jsname,pos) {
var th = document.getElementsByTagName(pos)[0];
var s = document.createElement('script');
s.setAttribute('type','text/javascript');
s.setAttribute('src',jsname);
th.appendChild(s);
}
addJavascript("myJs.js","body");

我还想知道当我们使用document.getElementsByTagName("head")[0]时会发生什么。

Answer 1

document.getElementsByTagName("tag here")[0]

这将找到带有指定标签的html中的第一个元素

对于body和head标签，它没有做任何特殊的事情，因为它们只定义了一次。

Answer 2

从您对该问题的评论：

我的目的是知道document.getElementsByTagName（“body”）[0]的作用。

document.getElementsByTagName找到文档中存在的元素，当你调用它时具有该标记（body，head，{{1} }，p，a等等。）因为您使用标记名div调用它，它会找到文档中的所有"body"元素，如果有的话任何你打电话的时候。

body然后尝试从结果列表中获取第一个条目。如果列表为空，则返回[0]。

因此undefined或者为您提供文档中的第一个（并且可能是唯一的）document.getElementsByTagName("body")[0]元素，如果没有（还有），则为body。

当我们在undefined或<script type="javascript" src=""myJs.js"></script>中使用<body>时使用<head>时，流量有何不同。

好吧，如果你在<head>中有它并且你运行它寻找body标记，document.getElementsByTagName('body')将返回一个空节点列表（因为head < strong>必须在body之前，因此[0]会为您提供undefined，并且尝试在其上使用appendChild将会失败。

如果您只是想在页面上可靠地添加script元素，那么通常情况下就是使用：

var parent = document.getElementsByTagName('script')[0].parentNode; // ...create your new script element parent.appendChild(yourScript);

...因为如果您的脚本正在运行（并且您没有推迟它并删除包含它的脚本元素），您知道在某处至少有一个script元素在页面上。

Answer 3

我不确定这里实际问的是什么，所以我猜你对[0]部分感到困惑。

好吧，document.getElementsByTagName查询标记中未知数量的元素。它将返回HTMLCollection，这是类似数组的结构。这就是为什么我们需要通过括号来解决该列表中的特定元素。

<body>和<head>个元素只允许在有效的HTML文档中使用，因此这看起来有点令人困惑。获取这些节点的更好方法是直接参考：

var head = document.head,
    body = document.body;

要处于保存方面，将其与后备相结合，你很好

head = document.head || document.getElementsByTagName("head")[0];

当我们使用document.getElementsByTagName（“body”）[0]时会发生什么？

3 个答案: