ক্যোয়ারী নির্বাচনকারী, ওয়াইল্ডকার্ড উপাদান ম্যাচ?


133

কোনও ওয়াইল্ডকার্ড উপাদান নামের সাথে মিল ব্যবহার করার কোনও উপায় আছে querySelectorবা querySelectorAll? আমি অ্যাট্রিবিউট ক্যোয়ারীতে ওয়াইল্ডকার্ডের জন্য সমর্থন দেখছি তবে উপাদানগুলির জন্য নয়।

আমি যে এক্সএমএল ডকুমেন্টটি পার্স করার চেষ্টা করছি সেটি হ'ল মূলত বৈশিষ্ট্যগুলির একটি সমতল তালিকা এবং আমার কাছে এমন উপাদানগুলির সন্ধান করতে হবে যাগুলির নামে নির্দিষ্ট স্ট্রিং রয়েছে।

আমি বুঝতে পারলাম এক্সএমএল ডকুমেন্টটি সম্ভবত পুনর্গঠনের প্রয়োজন আমার যদি এটির প্রয়োজন হয় তবে এটি কেবল ঘটবে না।

আপত্তিজনকভাবে হ্রাসপ্রাপ্ত XPath (আই 9 এটি বাদ পড়ে) ব্যবহার করে ফিরে যাওয়া ব্যতীত যে কোনও সমাধান গ্রহণযোগ্য।


"নাম" দ্বারা আপনি ট্যাগের নাম বোঝাচ্ছেন?
কেনেটিএম

1
@ জারেডএমসিএটিয়ারের উত্তর একটি উত্তর হিসাবে গ্রহণযোগ্যতার জন্য খুব উপযুক্ত। অনুগ্রহ করে বিবেচনা করুন.
আরবিটি

উত্তর:


347

[id^='someId']সমস্ত আইডির সাথে শুরু মিলবে someId

[id$='someId']এর সাথে শেষ হওয়া সমস্ত আইডির সাথে মিলবে someId

[id*='someId']সমন্বিত সমস্ত আইডির সাথে মিলবে someId

আপনি যদি nameবৈশিষ্ট্যটি সন্ধান করেন তবে কেবল বিকল্পটি idদিয়ে দিন name

আপনি যদি উপাদানটির ট্যাগ নামের বিষয়ে কথা বলছেন তবে আমি বিশ্বাস করি না যে এটির কোনও উপায় আছে querySelector


4
ধন্যবাদ, আমি ট্যাগ নাম বোঝাতে চেয়েছিলাম।
এরিক অ্যান্ডারসন

এইচএমএম আমি ডকুমেন্টটি করতে পারি
না.কুইলেসেক্টরআল

4
সেখানে সময়কাল সম্ভবত এটি document.querySelectorAll("div[id$='foo']")জগাখিচুড়ি হয় IE8 এর কেবল আংশিক কিউএসএ সমর্থন রয়েছে, আমি মনে করি তারা কেবল CSS2.1 নির্বাচককে সমর্থন করে, তাই এই নির্বাচকগুলি আইই 8 তে কাজ করবে না, তবে আই 9 + কাজ করবে।
জ্যারেডম্যাকএটিয়ার

এই উত্তর আমার জীবন বাঁচায়! ধন্যবাদ!!
মেনাস

28

আমি কোয়েসারসিলেক্টর () জড়িত ওয়ান-লাইনারগুলিতে গণ্ডগোল / ম্যাসেজ করছিলাম এবং এখানে আমার ট্যাগ উত্তর এবং ক্যোয়ারী নির্বাচনকারী () ট্যাগ ব্যবহার করে ওপি প্রশ্নের একটি সম্ভাব্য উত্তর আছে, আমার প্রশ্নটির উত্তর দেওয়ার জন্য @ জারেডম্যাকএটিয়ারের কাছে ক্রেডিট আছে, ওরফে রেজিএক্স-জাতীয় মত রয়েছে ভ্যানিলা জাভাস্ক্রিপ্টে ক্যোয়ারী নির্বাচনকারী () এর সাথে মেলে

নিম্নলিখিত আশা করা কার্যকর হবে এবং ওপি বা অন্য সবার প্রয়োজনের সাথে ফিট করে:

// 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"]');

তারপরে, আমরা উদাহরণস্বরূপ, এসআরসি স্টাফ ইত্যাদি পেতে পারি ...

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

12

স্পষ্ট বৈশিষ্ট্য হিসাবে ট্যাগনাম সেট করুন:

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

একটি এক্সএমএল ডকুমেন্টের জন্য আমার নিজের এটি দরকার ছিল, নেস্টেড ট্যাগগুলি শেষ হয়ে গেল _Sequence। আরও তথ্যের জন্য জারেডএমসিএটিয়ার উত্তর দেখুন ।

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

আমি এটি বললাম না যে এটি সুন্দর হবে :) পিএস: আমি tag_nameট্যাগ-নেম ব্যবহার করার পরামর্শ দেব , যাতে 'কম্পিউটার উত্পন্ন', অন্তর্নিহিত ডিওএম বৈশিষ্ট্যগুলি পড়ার সময় আপনি কোনও হস্তক্ষেপ না করেন।


8

আমি এই শর্ট স্ক্রিপ্টটি লিখেছি; কাজ মনে হচ্ছে।

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

ক্যোয়ারী দ্বারা প্রত্যাবর্তিত বস্তু নির্বাচনকারী সমস্ত প্রয়োজনীয়ভাবে সমস্ত ব্রাউজারগুলিতে ফিল্টার সমর্থন করে না (কারণ এটি সর্বদা নিয়মিত জাভাস্ক্রিপ্ট অ্যারে হয় না)। স্ক্রিপ্ট উত্পন্ন হওয়ার আগে (যদি স্ক্রিপ্টটি গতিশীলভাবে উত্পন্ন হয়), বা শর্ত বিবৃতি ব্যবহার করে উত্পাদনের ক্ষেত্রে এই দাবিটি পরীক্ষা করে দেখুন Make
দিমিত্রি

খুব সুন্দর উত্তর ... এটি আমার ইস্যুতে পাওয়া ক্লোস ম্যাচ। আমি কাস্টম উপাদানগুলির সাথে কাজ করছি এবং এর মতো বৈশিষ্ট্যগুলি এখনও ম্যানুয়াল কাজ, দুঃখের সাথে।
কোডেবলব

-1

যা নেই তা বলে একটি উপায় আছে। এটি এমন কিছু না যা কখনও হয় না make একটি ভাল সিএসএস নির্বাচনকারী রেফারেন্স: https://www.w3schools.com/cssref/css_selectors.asp যা দেখায়: নীচে নির্বাচক নয়:

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

এখানে একটি উদাহরণ রয়েছে: একটি ডিভ কিছু পরে অনুসরণ করে (অ্যাজ ট্যাগ ব্যতীত কিছু)

div > :not(z){
 border:1px solid pink;
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.