2017-10-05 3 views
1

私はウェブサイトを持っており、そのDOM要素をループして、指定されたテキストの一部を含むこれらの要素を指摘するスクリプトを使用したいとします。私は、DOM要素のすべての望ましい属性を見つけ出し、そこから配列を作成する単純なループを作成することができました。今では、配列属性値とそれが属するDOM要素をペアにし、配列要素(属性)とDOM要素に一致するテキストの特定の部分を見つけることもできます。バニラJavascriptで属性の一部を含むDOM要素を見つける

var getAll = document.getElementsByTagName('*'); 
var myArray = []; 

for (var i=0; i<getAll.length; i++) { 
    getHref = getAll[i].getAttribute('href'); 
    if (getHref !== null) { 
    myArray.push(getHref); 
    } 
} 

DOMエレメントと自分の属性をリンクする方法がわかりません。私はindexOf( '')を使用してテキストの一部を検索しようとしましたが、配列内の完全な文字列を検索するため動作しません。誰かがとても素敵で私を助けてくれますか?私はフレームワークを使いたくない。

答えて

0

は、今私はそれ が属するDOM要素を持つ私の配列属性値をペアリングしても は、配列要素(属性)とDOM要素と一致していることを、テキストの指定部分を見つけることができるようにしたいです。

単にを使用して一致する要素のみがセレクタ

var getAll = document.querySelectorAll("[href*='text-to-be-matched']"); 

が含まれていませなぜこれがforループを繰り返すことができNodeListとインデックス何がDOM要素であります見つけた。

var attributeValToDOMMap = {}; 
getAll.forEach(function(element){ 
    var hrefVal = element.getAttribute("href"); 
    attributeValToDOMMap[ hrefVal ] = attributeValToDOMMap[ hrefVal ] || []; //in case one href value is common with multiple DOM elements 
    attributeValToDOMMap[ hrefVal ].push(element); 
}); 
+0

これは素晴らしいです。どうもありがとう! – panxpiotr

0

何らかのテキストでhref属性をフィルタリングしたいですか?

.indexOf()を使用できますが、理由はわかりません。

または、最初にセレクタを改善することもできます(ただし、既に提案されています)。

hrefに表示されている部分文字列をフィルタリングするために、1行のコードが追加されています。

fiddle

関連する問題