javascript - href を使用して親 div を取得する

Question

href だけを使用して親 div を見つけることは可能ですか?

私は基本的に次の機能を持っています：

var hrefs = [];
[].forEach.call(document.querySelectorAll("area"), function (value, index, array) {
    hrefs.push(value.getAttribute("href"));
});

for (var i = 0; i < hrefs.length; i++) {
    console.log(hrefs[i]);
    }

これは、html 領域に属するすべての href を検索します。これらの hrefs の親要素を見つけて、その親要素に新しい div を追加できるようにしようとしています。これが不可能な場合、その属性の親 div を特定できるようにするには、どの属性が必要でしょうか。

Answer 1

あなたはこのようなものが欲しいですか?:

var hrefs = document.querySelectorAll("area");

for (var i = 0; i < hrefs.length; i++) {
    console.log(hrefs[i].getAttribute('href'));
    console.log(hrefs[i].parentNode);
}

Answer 2

最初に、これらすべての要素を持つオブジェクトを作成します。

var hrefs = {};

Array.prototype.forEach.call(document.querySelectorAll("area[href]"), function (element) {
    hrefs[ element.getAttribute("href") ] = element;
});

次に、次を使用して親にアクセスできます.parentNode。

for ( var i in hrefs ) {
    console.log( i, hrefs[i].parentNode );
}

---

したがって、後で の親に要素を追加する場合は、次のhttp://www.google.comようにします。

hrefs['http://www.google.com'].parentNode.appendChild( element );

Answer 3

なぜあなたがそうしないのかわかりません：

[].forEach.call(document.querySelectorAll("area"), function(area) {
    area.parentNode.appendChild(
        document.createElement("div")
    );
});

Answer 4

jQuery を使用する場合は、これを行うために使用できる .parent() メソッドがあります。