4

parentNode (または同様のもの) 呼び出しをチェーンすることは可能ですか?

たとえば、次の html があるとします。

<div id="mainDiv">

    <div class="class1" id="id1">
        <div class="button" id="button"></div>
    </div>

    <div class="class2" id="id2">
    </div>

</div>

ここで、「ボタン」にイベント リスナーがあるとします。ここで、id="id2" を別のもの、たとえば "newId" に変更したいので、この関数を "クリック" で呼び出します。このようなことをすることは合法ですか?:

function changeIdOfItem(event) {
    var event.target.parentNode.parentNode.lastChild.id = "newId";
}

私の論理は、最初のparentNodeが「id1」に移動し、2番目のparentNodeが「mainDiv」に移動し、lastChildが「id2」に移動してIDを変更できるということです。この方法ではない場合、「純粋な」JavaScript でこれを達成するにはどうすればよいでしょうか?

4

2 に答える 2

4

質問の根底にあるのは、はい、各呼び出しが同じプロパティが公開されたNode.parentNode別の呼び出しを返すため、呼び出しを連鎖させることができます。Node視覚的に:

<div id="baz">
  <div id="bar">
    <p id="foo">Hello, world!</p>
  </div>
<div>


var el = document.getElementById('foo'); // p#foo

// traversing, route a:
var bar = el.parentNode;
var baz = bar.parentNode;

// traversing, route b:
var baz = el.parentNode.parentNode;
//          ^   #bar  ^
//                      ^  #baz  ^

ただし、要素の ID を変更するのは (ほぼ間違いなく) 貧弱な設計であり、代わりに a を追加 (または削除) することを検討しますclassName。

于 2013-07-19T18:42:43.783 に答える
1

チェーンparentNode(または同様の) 呼び出しを行うことは可能ですか?

「 call 」という用語は(関数のメソッドのように) 使用しません。それらは単なるプロパティ アクセスです。しかし、はい、実際にそれらをネスト/チェーンできます。

私の論理では、最初parentNodeは「id1」まで、2 番目parentNodeは「mainDiv」まで、

はい、はい。

次にlastChild、「id2」に移動します

いいえ。その div の最後の子は、 の後の空白テキスト ノードになり#id2ます。.lastElementChildただし、使用できます。

id="id2" を「newId」などの別のものに変更したい。この方法ではない場合、「純粋な」JavaScript でこれを達成するにはどうすればよいでしょうか?

そのIDでdivに直接アクセスするだけです：

var otherDiv = document.getElementById("id2");
if (otherDiv != null) // when it will have been changed once,
                      // the `#id2` selector won't get it any more
    otherDiv.id = "newId";`enter code here`
于 2013-07-19T19:00:18.213 に答える