querySelector, 와일드 카드 요소 일치?

querySelector, 와일드 카드 요소 일치?

---

querySelector또는 사용하여 와일드 카드 요소 이름 일치를 수행하는 방법이 querySelectorAll있습니까? 속성 쿼리에서 와일드 카드를 지원하지만 요소 자체는 지원하지 않습니다.

구문 분석하려는 XML 문서는 기본적으로 속성의 단순 목록이며 이름에 특정 문자열이있는 요소를 찾아야합니다.

나는 이것이 필요하다면 XML 문서가 아마도 재구성이 필요하다는 것을 알고 있지만 그것은 일어나지 않을 것입니다.

더 이상 사용되지 않는 XPath (IE9가 삭제)를 사용하는 것으로 돌아가는 것을 제외한 모든 솔루션이 허용됩니다.

---

[id^='someId']로 시작하는 모든 ID와 일치합니다 someId.

[id$='someId']로 끝나는 모든 ID와 일치합니다 someId.

[id*='someId']을 포함하는 모든 ID와 일치합니다 someId.

당신이 찾고 있다면 name속성 단지 대체 id와 함께 name.

요소의 태그 이름에 대해 이야기하고 있다면 사용하는 방법이 없다고 생각합니다. querySelector

---

나는 querySelector ()와 관련된 한 줄짜리 줄을 엉망으로 만들었고 여기에서 끝났고 태그 이름과 querySelector ()를 사용하여 OP 질문에 대한 가능한 답변을 얻었으며 @JaredMcAteer가 내 질문에 답한 크레딧을 가지고 있습니다. 바닐라 Javascript의 querySelector ()와 일치

다음이 유용하고 OP의 요구 또는 다른 모든 사람의 요구에 적합하기를 바랍니다.

// 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);
//> (...)

---

tagName을 명시 적 속성으로 설정하십시오.

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

XML 문서의 경우 .NET로 끝나는 중첩 태그가 필요했습니다 _Sequence. 자세한 내용은 JaredMcAteer 답변을 참조하십시오.

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

나는 그것이 예쁘다고 말하지 않았다 :) 추신 : 나는 tag_nametagName 이상 을 사용 하는 것이 좋습니다 . 그래서 당신은 '컴퓨터 생성', 암시 적 DOM 속성을 읽을 때 간섭을받지 않습니다.

---

이 짧은 스크립트를 방금 작성했습니다. 작동하는 것 같습니다.

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

---

아닌 것을 말하는 방법이 있습니다. 결코 될 수없는 것을 만드십시오. 좋은 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;
}

참고 URL : https://stackoverflow.com/questions/8714090/queryselector-wildcard-element-match