QuerySelector, подстановочный знак?

Есть ли способ сопоставления имени подстановочного элемента с помощью querySelector или querySelectorAll? Я вижу поддержку подстановочных знаков в запросах атрибутов, но не для самих элементов.

XML-документ, который я пытаюсь проанализировать, в основном представляет собой плоский список свойств, и мне нужно найти элементы, которые имеют определенные строки в своих именах.

Я понимаю, что XML-документ, вероятно, нуждается в реструктуризации, если мне это нужно, но этого просто не произойдет.

Любое решение, за исключением возврата к использованию явно устаревшего XPath (IE9 отбросило его), приемлемо.

Ответы

Ответ 1

[id^='someId'] будет соответствовать всем идентификаторам, начиная с someId.

[id$='someId'] будет соответствовать всем идентификаторам, заканчивающимся на someId.

[id*='someId'] будет соответствовать всем идентификаторам, содержащим someId.

Если вы ищете атрибут name, просто замените id на name.

Если вы говорите об имени тега элемента, я не думаю, что есть способ использовать querySelector

Ответ 2

Я возился с одной строкой, включающей querySelector(), и закончил здесь, и у меня есть возможный ответ на вопрос OP, используя имена тегов и querySelector(), с кредитами на @JaredMcAteer для ответа на МОЙ вопрос, иначе есть RegEx-like совпадает с querySelector() в ванильном JavaScript

Надеемся, что следующее будет полезно и соответствует потребностям ОП или всем остальным:

// basically, of before:
var youtubeDiv = document.querySelector('iframe[src="http://www.youtube.com/embed/Jk5lTqQzoKA"]')

// after     
var youtubeDiv = document.querySelector('iframe[src^="http://www.youtube.com"]');
// or even, for my needs
var youtubeDiv = document.querySelector('iframe[src*="youtube"]');

Затем мы можем, например, получить src и т.д.

console.log(youtubeDiv.src);
//> "http://www.youtube.com/embed/Jk5lTqQzoKA"
console.debug(youtubeDiv);
//> (...)

Ответ 3

Установите 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_name над tagName, поэтому вы не сталкиваетесь с помехами при чтении "сгенерированных компьютером", неявных атрибутах DOM.

Ответ 4

Я просто написал этот короткий script; кажется, работает.

/**
 * 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"

Ответ 5

Есть способ сказать, что это не так. Просто сделай то, чего никогда не будет. Хорошая ссылка на селектор 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;
}

Ответ 6

Это работает для меня:

NSString *nameInWeb = [NSMutableString stringWithFormat:@"document.querySelector('[name$=\"057\"]').name"];

Показать все имена, заканчивающиеся на "057".