0

在 html 我有这样的代码

<body>
  <script src="debug.js"></script>   
  <button id="proof" onclick="debug('result:', this);">proof</button>
</body>

在javascript中：

function debug(msg, e) 
{

    var log = document.getElementById("debuglog");

    if (!log)// If no element with the id "debuglog" exists, create one.
    {
        log = document.createElement("div"); /
        log.id = "debuglog";
        log.innerHTML = "<h1>Debug Log</h1>"; 
        document.body.appendChild(log); 
   }


    var pre = document.createElement("pre");
    var text = document.createTextNode(msg + e.parentNode.getElementById("proof")); //<--PROBLEM HERE
    pre.appendChild(text);
    log.appendChild(pre); 
    }
}

请注意，如果我在文本节点中写入msg + e.parentNode，则代码有效，一旦我添加.getElementById("proof")，则不会检索到任何结果（我认为脚本在运行时阶段出错）。

我想要做的是“导航”通过 html 元素，调用他的父母和他的孩子

4

2 回答 2

1

getElementById是 的原型document，而不是每个元素（在文档中）的原型。
因此，如果您想限制getElementById搜索特定元素的子元素而不是搜索整个文档（就像getElementsByTagName使用特定元素作为父元素一样），您需要将自己的原型添加到所有元素（但 IE 不支持在 HTMLElement 上进行原型设计）或编写自己的函数。

请参阅此页面以获取一些建议，但请记住，一个 Id 在页面中应该始终是唯一的，因此仅使用document.getElementById在浏览器中内置和优化的 Id 仍然会更快。

更新：
这是我链接到的函数的重写，没有错误和更快的反向循环：

function GetChildById( dNode, id ) {
    var i, dResult = null;

    if ( dNode.getAttribute('id') === id ) { return dNode; }

    i=dNode.childNodes.length;
    while ( i-- ) {
        if ( dNode.childNodes[i].nodeType === 1 ) {
            dResult = GetChildById( dNode.childNodes[i], id );
            if ( dResult !== null )
                break;
        }
    }

    return dResult;
}

用法：GetChildById( node, 'id' )

演示：jsfiddle

但就像 axel.michel 说的：不要那样做，没用。

于 2013-01-18T12:56:23.567 回答
0

由于 ID 必须是页面上的唯一元素，因此您只需使用 document.getElementById('YOURID') 即可访问它。它是文档方法，因此您的脚本会引发错误。如果你想实现这样的东西，你必须通过自定义函数来实现：

function youShouldNotDoThis( element, id ) {
    var hit = null;
    if ( element.getAttribute('id') == id ) {
        return element;
    }
    for ( var i = 0, l = element.childNodes.length; i < l; i++ ) {
        if ( element.childNodes[i].nodeType == 1 ) {
            hit = youShouldNotDoThis( element.childNodes[i], id );
            if ( hit != null ) {
                break;
            }
        }
    }
    return hit;
}

在您的脚本片段中：

var whyEver = youShouldNotDoThis(e.parentNode,'proof');
var text = document.createTextNode(msg + whyEver); //<--NO MORE PROBLEM HERE

同样，您不应该通过属性 ID 执行此操作，因为 ID 应该是唯一的，但您可以轻松更改此功能以扫描与 ID 不同的内容。

于 2013-01-18T12:42:14.007 回答