0

我一直在学习关于函数、返回、id 和所有东西的非常简单的东西，所以我遇到了另一个看起来很简单的问题，但我不明白为什么会这样。检查此代码：

function test() {
    var text = document.createTextNode("Hello");
    text.id = "t";
    }


var whatIjustwrote = window.document.getElementById("t");
alert(whatIjustwrote);​

是否getElementById有仅查找全局项目的限制？使该警报输出函数内的文本节点的方法是什么？

感谢您的任何评论。最近几天在这里问东西我学到了很多东西！

JSFiddle

4

4 回答 4

5

首先，getElementById只会返回一个元素，并且您正在创建一个文本节点。

其次，它只会返回一个已添加到 DOM 的元素。您创建的节点不会被添加到 DOM 中，因此即使可以找到它也不会被找到。

最后，您实际上并没有调用该test函数，因此文本节点甚至没有在内存中创建。

这是一个更新的小提琴，演示了getElementById实际工作：

function test() {
    var text = document.createElement("span"); //Create an element
    text.innerHTML = "Hello";
    text.id = "t";
    document.body.appendChild(text); //Add it to the DOM
}

test(); //Invoke the function (so the element actually gets created)
var yourElement = document.getElementById("t"); //Get reference to element
于 2012-11-07T12:03:48.507 回答
2

getElementById只搜索元素节点。您确实创建了一个既没有属性也没有 id 的文本节点 - 您只是向 JS 对象添加了一个自定义属性。此外，您没有将节点附加到文档中，因此无法在 DOM 树中找到它。

您可能想阅读DOM 的介绍（在 MDN）、quirksmode.org 上的介绍，甚至是W3 标准本身（尤其是介绍部分）

function test() {
    var elem = document.createElement("span"); // Create an element
    var text = document.createTextNode("Hello"); // Create a textnode
    elem.appendChild(text); // add text to the element
    elem.id = "t"; // assign id to the element
    document.body.appendChild(elem); // Add it to the DOM
}
test();

var yourElement = document.getElementById("t"); // Get the element from the DOM
alert(yourElement.textContent); // alerts "Hello"
// you also could have alerted yourElement.firstChild.data - the content of the 
// textnode, but only if you had known that yourelement really has a firstchild

（在 jsfiddle.net 上的演示）

于 2012-11-07T12:03:35.450 回答
1

getElementById 是否有仅查找全局项目的限制？

答案是不。首先，无论如何您都必须定义全局项目。任何附加到 DOM 的东西实际上都是全局的，就全局 javascript 对象而言，在浏览器的情况下只有一个窗口。您正在创建一个函数，但您从未执行它。

此外，文本节点实际上不能有 id 或任何其他属性。为此，您需要一个元素，因此即使您执行该函数，您仍然会得到空值。此外，创建节点不会附加到DOM，因此即使这不是文本节点，您也无法访问它。

我已经更新了你的小提琴。

于 2012-11-07T12:04:46.233 回答
1

想到几点..

1）你不能给 textNode 一个 id 属性（你实际上是给它一个名为 id 的新成员变量） 2）要找到一个元素，它必须存在于文档的 DOM 中

改为这样做：

var mSpan = document.createElement('span');
mSpan.id = 't';
mSpan.appendChild( document.createTextNode('Hello') );
document.body.appendChild(mSpan);

var whatIjustwrote = window.document.getElementById("t");
alert(whatIjustwrote.innerText);
于 2012-11-07T12:08:31.727 回答