document.getElementById无法正常工作？

Question

有人可以解释为什么这行不通吗？

var element = document.getElementById('element'); // Works OK
var slide = element.getElementById('slide'); // Throws an error

因此，想法是只获取一次DOM，而我在该变量中拥有所有标签，然后可以对其进行操作并从该变量中获取其余信息。

如何从element变量中获取其他元素？ 使用document.getElementById('id');是否不好document.getElementById('id'); 每次我需要DOM中的东西吗？ 它会减慢网页速度吗？

我该如何解决这个问题？

请不要jQuery，请使用纯Javascript！

谢谢

Answer 1

元素没有getElementById方法， document没有，

所以用

document.getElementById('slide');

Answer 2

您正在尝试通过其ID获取元素。 因此它是嵌套在元素内还是父元素都没有关系！ 因为DOM中最多只能有一个元素具有相同的ID。

与获取您必须使用的第一个元素相同：

document.getElementById('slide');

代替：

element.getElementById('slide');

因为element变量没有方法getElementById。 您可以从文档对象中获得该信息。

Answer 3

document.getElementById('element'); 将从您的DOM中获取具有特定ID的控件。 因此，要获得ID slide控制权，您还必须使用document对象

document.getElementById('slide');

Answer 4

Element.prototype.getElementById = function(req) {
    var elem = this, children = elem.childNodes, i, len, id;

    for (i = 0, len = children.length; i < len; i++) {
        elem = children[i];

        //we only want real elements
        if (elem.nodeType !== 1 )
            continue;

        id = elem.id || elem.getAttribute('id');

        if (id === req) {
            return elem;
        }
        //recursion ftw
        //find the correct element (or nothing) within the child node
        id = elem.getElementById(req);

        if (id)
            return id;
    }
    //no match found, return null
    return null;
}

所以你可以使用这段代码

var element = document.getElementById('element'); // Works OK
var slide = element.getElementById('slide'); // Will work

从另一个问题的答案