219

orを使用してワイルドカード要素名の一致を行う方法はありますquerySelectorかquerySelectorAll?

解析しようとしている XML ドキュメントは、基本的にプロパティのフラット リストです。

  • 名前に特定の文字列が含まれる要素を見つける必要があります。
  • 属性クエリではワイルドカードがサポートされていますが、要素自体ではサポートされていません。

明らかに非推奨の XPath (IE9 で削除された) の使用に戻る以外の解決策は受け入れられます。

4

6 に答える 6

528

[id^='someId']で始まるすべての ID に一致しsomeIdます。

[id$='someId']で終わるすべての ID に一致しsomeIdます。

[id*='someId']を含むすべての ID に一致しますsomeId。

属性を探している場合は、nameに置き換えidてnameください。

要素のタグ名について話している場合、使用する方法があるとは思いませんquerySelector

サードパーティ編集

例

  • aria-label が で始まるすべてのノードを見つけるImportant_foo
  • 見つかったノードごとに、その aria-label をコンソールに記録します

コード

var nodeList = document.querySelectorAll('[aria-label^="Important_foo"]');
nodeList.forEach(node=> { console.log(node.getAttribute("aria-label"))});
于 2012-01-03T15:19:53.347 に答える
14

tagNameを明示的な属性として設定します。

for(var i=0,els=document.querySelectorAll('*'); i<els.length;
          els[i].setAttribute('tagName',els[i++].tagName) );

ネストされたタグがで終わるXMLドキュメントの場合、これが自分で必要でした_Sequence。詳細については、 JaredMcAteerの回答を参照してください。

document.querySelectorAll('[tagName$="_Sequence"]')

私はそれがきれいだとは言いませんでした:)PS：tag_nametagNameよりも使用することをお勧めします。そうすれば、「コンピューターで生成された」暗黙のDOM属性を読み取るときに干渉に遭遇することはありません。

于 2012-05-30T21:55:52.690 に答える
11

この短いスクリプトを書きました。動作するようです。

/**
 * Find all the elements with a tagName that matches.
 * @param {RegExp} regEx  regular expression to match against tagName
 * @returns {Array}       elements in the DOM that match
 */
function getAllTagMatches(regEx) {
  return Array.prototype.slice.call(document.querySelectorAll('*')).filter(function (el) { 
    return el.tagName.match(regEx);
  });
}
getAllTagMatches(/^di/i); // Returns an array of all elements that begin with "di", eg "div"
于 2015-08-18T18:09:27.977 に答える
-2

あるものではないという言い方があります。決してそうならないものにしないでください。優れた CSS セレクター リファレンス: https://www.w3schools.com/cssref/css_selectors.asp :not セレクターを次のように示します。

:not(selector)  :not(p) Selects every element that is not a <p> element

次に例を示します: div の後に何か (az タグ以外のもの)

div > :not(z){
 border:1px solid pink;
}
于 2019-04-20T19:28:52.000 に答える