querySelector องค์ประกอบสัญลักษณ์แทนตรงกันหรือไม่

มีวิธีในการจับคู่องค์ประกอบชื่อตัวแทนโดยใช้querySelectorหรือquerySelectorAllไม่ ฉันเห็นการสนับสนุนสัญลักษณ์แทนในแบบสอบถามแอททริบิว แต่ไม่ใช่สำหรับองค์ประกอบเอง

เอกสาร XML ที่ฉันพยายามวิเคราะห์นั้นเป็นรายการคุณสมบัติโดยทั่วไปและฉันต้องการค้นหาองค์ประกอบที่มีสตริงบางอย่างในชื่อของพวกเขา

ฉันรู้ว่าเอกสาร XML น่าจะต้องมีการปรับโครงสร้างหากฉันต้องการสิ่งนี้ แต่นั่นก็ไม่ได้เกิดขึ้น

วิธีการแก้ปัญหาใด ๆ ยกเว้นกลับไปใช้ XPath ที่เห็นได้ชัดว่าเลิก (IE9 ลดลง) เป็นที่ยอมรับ

[id^='someId']someIdจะตรงกับรหัสทั้งหมดที่เริ่มต้นด้วย

[id$='someId']someIdจะตรงกับรหัสทั้งหมดที่ลงท้ายด้วย

[id*='someId']someIdจะตรงกับรหัสทั้งหมดที่มี

หากคุณกำลังมองหาnameแอตทริบิวต์เพียงทดแทนด้วยidname

หากคุณกำลังพูดถึงชื่อแท็กขององค์ประกอบฉันไม่เชื่อว่ามีวิธีการใช้ querySelector

ฉันกำลังสับสน / ครุ่นคิดเกี่ยวกับ one-liners ที่เกี่ยวข้องกับ querySelector () และจบลงที่นี่และมีคำตอบที่เป็นไปได้สำหรับคำถาม OP โดยใช้ชื่อแท็ก & querySelector () โดยให้เครดิตกับ @JaredMcAteer สำหรับตอบคำถามของฉัน จับคู่กับ querySelector () ในวานิลลา Javascript

การหวังว่าสิ่งต่อไปนี้จะเป็นประโยชน์และสอดคล้องกับความต้องการของ 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 stuff, etc ...

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 โดยที่แท็กที่ซ้อนกันลงท้าย_Sequenceด้วย ดูJaredMcAteerคำตอบสำหรับรายละเอียดเพิ่มเติม

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

ฉันไม่ได้บอกว่ามันจะสวย :) PS: ฉันอยากจะแนะนำให้ใช้tag_nameมากกว่า tagName ดังนั้นคุณจึงไม่ต้องเจอกับการรบกวนเมื่ออ่าน 'คอมพิวเตอร์สร้างขึ้น' โดยปริยายแอตทริบิวต์ 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(selector)  :not(p) Selects every element that is not a <p> element

นี่คือตัวอย่าง: div ตามด้วยบางสิ่ง (ยกเว้นแท็ก az)

div > :not(z){
 border:1px solid pink;
}