Question

I have this script:

<script>

var prop = document.getElementById('div1').firstChild.getAttribute("id");

function aler()
{
    alert(prop);
}
</script>

并且不在脚本标记中：

<div id="div1">some content</div>
<button onclick="aler()"></button>

有人可以向我解释为什么当我点击按钮时会说：“undefined”

校正：我在div中拖了一张图片：

  <img  id="C" src="C.png"  draggable="true" ondragstart="drag(event)" width="91px" height="91px">

例如。

Answer 1

div1的第一个子节点是文本节点。它没有id。

修改

关于您的更正，如果生成的HTML看起来像这样任何，那么第一个子节点仍然是文本节点：

<div id="div1">
    <img  id="C" etc.>
</div>

因为文本包含制表符，空格和返回。我不确定拖放会如何影响它。

Answer 2

在DOM中，有各种各样的“节点”。您的<div id="div1">some content</div>标记定义了两个节点：Element是div，其第一个（也是唯一的）子节点，Text节点包含您在div中的文字。 Text节点没有id。 div元素有id，但文本节点没有。{/ p>

Answer 3

document.getElementById('div1').firstChild是文字some content。当您致电getAttribute("id")时，由于纯文字没有id，您将获得undefined。

使用alert（）时变量未定义

3 个答案: