Chrome 拡張機能では、バックグラウンド ページで HTML ドキュメントを取得し、そのドキュメントを調べて特定のアンカー タグ内に表示されるテキストを探す必要があります。アンカー タグには ID 属性はありませんが、href コンテンツによって識別できます。コードの残りの部分との一貫性を保つために、XMLHttpRequest の結果から作成されたドキュメント オブジェクトを介して、この情報の取得を処理したいと考えています。
私の問題は、作成した DOM で getElementsByTagName("a") を呼び出し、結果の要素の href 属性を検索すると、絶対 URL を持つタグのみが有効な href 値を返し、相対 URL を持つタグは返されることです。 null href 値を返します。検索する必要があるアンカー タグは、相対 URL を持つタグの 1 つです。
エラーを再現するコードの最も単純な形式を次に示します。なぜこれが起こっているのか、できればDOMの解析を放棄せずに修正を書く方法を知っている人はいますか?
function lookfor(linkContents, inURL) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(data) {
if (xhr.readyState == 4) {
if (xhr.status == 200) {
var doc = document.implementation.createHTMLDocument("");
doc.documentElement.innerHTML = xhr.responseText;
// Find Link in DOM of Document Created From HTTPRequest
var found = -1;
var links = doc.getElementsByTagName("a");
console.log(links);
for(var i = 0; i < links.length; i++) {
if (links[i].href) {
console.log(i + " " + links[i].href);
if (links[i].href.indexOf(linkContents) > -1) {
found = i;
}
}
}
if (found > -1) {
alert(links[found].innerHTML);
}
}
}
}
xhr.open('GET', inURL, true);
xhr.send();
}
[アップデート]
この回答に基づいて、次のコードを使用して、今のところ問題を解決することができました: How do I do OuterHTML in firefox?
function getHref(anchor) {
var href =
((new XMLSerializer().serializeToString(anchor) || "")
.match(/href=("[^"'<>\s]+"|'[^"'<>\s]+'|[^"'<>\s]+)/i) || [""])[0]
.replace(/(href=|'|")/ig, "")
;
if (href != "") return href;
}
興味深いことに、型チェックでは機能しません。href 値を生成しない同じ相対リンクには、typeof 'Anchor' もありません。