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、すべての要素 (ドキュメント内) のプロトタイプではありません。そのため、ドキュメント全体を検索するのではなく、特定の要素の子を検索
するように制限したい場合(特定の要素を親として使用できるのと同じ方法で)、すべての要素に独自のプロトタイプを追加する必要があります (ただし、IE は HTMLElement のプロトタイピングをサポートしていません)、または独自の関数を記述します。getElementByIdgetElementsByTagName

いくつかの提案については、このページを参照してください。ただし、ID は常にページ内で一意である必要があることに注意してください。したがってdocument.getElementById、ブラウザーに組み込まれて最適化されている ID を使用するだけで、より高速になります。

更新:
これは、リンクした関数を書き直したもので、エラーと高速な逆-whileループはありません:

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 に答える