Czy istnieje sposób na dopasowanie nazwy elementu wieloznacznego za pomocą querySelector
lub querySelectorAll
? Widzę obsługę symboli wieloznacznych w zapytaniach o atrybuty, ale nie dla samych elementów.
Dokument XML, który próbuję przeanalizować, to w zasadzie płaska lista właściwości i muszę znaleźć elementy, które mają określone ciągi w swoich nazwach.
Zdaję sobie sprawę, że dokument XML prawdopodobnie wymaga restrukturyzacji, jeśli tego potrzebuję, ale tak się nie stanie.
Każde rozwiązanie poza powrotem do używania najwyraźniej przestarzałego XPath (IE9 go porzuciło) jest dopuszczalne.
javascript
dom
domparser
selectors-api
Erik Andersson
źródło
źródło
Odpowiedzi:
[id^='someId']
dopasuje wszystkie identyfikatory zaczynające się odsomeId
.[id$='someId']
dopasuje wszystkie identyfikatory kończące się nasomeId
.[id*='someId']
dopasuje wszystkie identyfikatory zawierającesomeId
.Jeśli szukasz
name
atrybutu, zastąpid
goname
.Jeśli mówisz o nazwie tagu elementu, nie sądzę, aby można było użyć
querySelector
źródło
document.querySelectorAll("div[id$='foo']")
IE8 ma tylko częściową obsługę QSA, myślę, że obsługują tylko selektory CSS2.1, więc te selektory nie będą działać w IE8, ale IE9 + będzie działać.Robiłem zamieszanie / zastanawiałem się nad tekstami jednowierszowymi związanymi z querySelector () i skończyłem tutaj, i mam możliwą odpowiedź na pytanie OP za pomocą nazw tagów i querySelector (), z kredytami dla @JaredMcAteer za odpowiedź na MOJE pytanie, aka mają podobne do RegEx pasuje do querySelector () w zwykłym JavaScript
Mając nadzieję, że poniższe elementy okażą się przydatne i będą pasować do potrzeb OP lub wszystkich innych:
// 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"]');
Następnie możemy na przykład pobrać zawartość src itp.
console.log(youtubeDiv.src); //> "http://www.youtube.com/embed/Jk5lTqQzoKA" console.debug(youtubeDiv); //> (...)
źródło
Ustaw tagName jako jawny atrybut:
for(var i=0,els=document.querySelectorAll('*'); i<els.length; els[i].setAttribute('tagName',els[i++].tagName) );
Sam potrzebowałem tego dla dokumentu XML z zagnieżdżonymi tagami kończącymi się na
_Sequence
. Zobacz odpowiedź JaredMcAteer, aby uzyskać więcej informacji.document.querySelectorAll('[tagName$="_Sequence"]')
Nie powiedziałem, że to będzie ładne :) PS: Polecam użycie
tag_name
over tagName, abyś nie wpadał w interferencje podczas czytania „wygenerowanych przez komputer”, niejawnych atrybutów DOM.źródło
Właśnie napisałem ten krótki scenariusz; wydaje się działać.
/** * 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"
źródło
Jest sposób, aby powiedzieć, co nie jest. Po prostu spraw, aby nie było czymś, czym nigdy nie będzie. Dobre odniesienie do selektora css: https://www.w3schools.com/cssref/css_selectors.asp, które pokazuje: not selector w następujący sposób:
Oto przykład: element div, po którym następuje coś (cokolwiek oprócz znacznika az)
div > :not(z){ border:1px solid pink; }
źródło