জ্যাকুরিতে কেবল প্রথম-স্তরের উপাদান নির্বাচন করা

Question 1

আমি <ul>এই জাতীয় তালিকা থেকে কেবল পিতামাতার লিঙ্ক উপাদানগুলি কীভাবে নির্বাচন করতে পারি ?

<ul>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a>
  <ul>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
    <li><a href="#">Link</a></li>
  </ul>
</li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>

সিএসএসে ul li a, তবে নাul li ul li a

ধন্যবাদ

Question 2

$("ul > li a")

তবে আপনি যদি নির্দিষ্টভাবে বাইরের দিকের উলটিকে লক্ষ্য করতে চান তবে আপনাকে মূল উলটিতে একটি ক্লাস স্থাপন করতে হবে:

<ul class="rootlist">
...

তারপর, এটা এর:

$("ul.rootlist > li a")....

আপনার কাছে কেবলমাত্র মূল উপাদান রয়েছে তা নিশ্চিত করার আরেকটি উপায়:

$("ul > li a").not("ul li ul a")

এটিকে দেখতে দুর্গন্ধযুক্ত মনে হলেও কৌশলটি করা উচিত

Question 3

আপনার প্রাথমিক আলটি একবার হয়ে গেলে আপনি বাচ্চাদের () পদ্ধতিটি ব্যবহার করতে পারেন , যা কেবলমাত্র উপাদানটির তাত্ক্ষণিক শিশুদের বিবেচনা করবে। @ অ্যাক্টিভা হিসাবে উল্লেখ করা হয়েছে যে সহজেই মূল উপাদানটি নির্বাচন করার একটি উপায় হ'ল এটিকে কোনও শ্রেণি বা একটি আইডি দেওয়া। নিম্নলিখিতটি আইডির সাথে একটি মূল উল রয়েছে বলে ধরে নেওয়া হয়েছে root।

$('ul#root').children('li');

Question 4

অন্যান্য উত্তরে বর্ণিত হিসাবে, সবচেয়ে সহজ পদ্ধতিটি হ'ল মূল উপাদানটি আইডি বা শ্রেণীর নাম অনুসারে স্বতন্ত্রভাবে চিহ্নিত করা এবং সরাসরি বংশধর নির্বাচনকারীকে ব্যবহার করা।

$('ul.topMenu > li > a')

যাইহোক, আমি একটি সমাধান যার উপর কাজ করবে সন্ধানে এই প্রশ্নের জুড়ে এসেছিল নামহীন উপাদান এ তারতম্য অতল DOM এর।

প্রতিটি উপাদান যাচাই করে এটি অর্জন করা যেতে পারে এবং মেলাও উপাদানগুলির তালিকায় এর কোনও পিতা-মাতার নেই uring এখানে আমার সমাধানটি , jQuery নির্বাচক 'শীর্ষস্থানে' মোড়ানো।

jQuery.extend(jQuery.expr[':'], {
  topmost: function (e, index, match, array) {
    for (var i = 0; i < array.length; i++) {
      if (array[i] !== false && $(e).parents().index(array[i]) >= 0) {
        return false;
      }
    }
    return true;
  }
});

এটি ব্যবহার করে মূল পোস্টের সমাধানটি হ'ল:

$('ul:topmost > li > a')

// Or, more simply:
$('li:topmost > a')

সম্পূর্ণ jsFizz এখানে উপলব্ধ ।

Question 5

কেবল আপনি এটি ব্যবহার করতে পারেন ..

$("ul li a").click(function() {
  $(this).parent().find(">ul")...Something;
}

উদাহরণ দেখুন: https://codepen.io/gmkhussain/pen/XzjgRE

Question 6

ফলাফলগুলি এখনও শিশুদের কাছে প্রবাহিত হলে আপনি এটি চেষ্টা করতে চাইতে পারেন, অনেক ক্ষেত্রে JQuery এখনও বাচ্চাদের জন্য প্রযোজ্য হবে।

$("ul.rootlist > li > a")

এই পদ্ধতিটি ব্যবহার করে: E> F কোনও এফ উপাদানগুলির সাথে মেলে যা কোনও উপাদান E এর শিশু is

জিকুয়ারিকে কেবল স্পষ্ট শিশুদের জন্য সন্ধান করতে বলে। http://www.w3.org/TR/CSS2/selector.html

Question 7

আপনি $("ul li:first-child")কেবলমাত্র উল এর সরাসরি বাচ্চাদের পেতে ব্যবহার করতে পারেন ।

যদিও আমি সম্মত হচ্ছি, মূল ইউএল সনাক্ত করতে আপনার একটি আইডি বা অন্য কিছু দরকার নেই অন্যথায় এটি কেবল সমস্তটি নির্বাচন করবে। আপনার যদি ইউল এর চারপাশে কোনও আইডি দিয়ে ডিভ থাকে তবে করণীয় সবচেয়ে সহজ কাজ$("#someDiv > ul > li")

Question 8

এটা চেষ্টা কর:

$("#myId > UL > LI")

Question 9

যে কোনও গভীরতা থেকে নেস্টেড ক্লাসে আমার কিছুটা সমস্যা হয়েছিল তাই আমি এটিকে বুঝতে পেরেছিলাম। এটি কেবলমাত্র প্রথম স্তরটি নির্বাচন করবে এটির সাথে জ্যাকুরি অবজেক্ট রয়েছে এমন মুখোমুখি হয়:

var $elementsAll = $("#container").find(".fooClass");4

var $levelOneElements = $elementsAll.not($elementsAll.children().find($elementsAll));

$levelOneElements.css({"color":"red"})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="fooClass" style="color:black">
Container
  <div id="container">
    <div class="fooClass" style="color:black">
      Level One
      <div>
        <div class="fooClass" style="color:black">
             Level Two
        </div>
      </div>
    </div>
    <div class="fooClass" style="color:black">
      Level One
      <div>
        <div class="fooClass" style="color:black">
             Level Two
        </div>
      </div>
    </div>
  </div>
</div>

স্নিপেট প্রসারিত করুন

Question 10

ঘ

 $("ul.rootlist > target-element")
2   $("ul.rootlist").find(target-element).eq(0) (only one instance)
3   $("ul.rootlist").children(target-element)

সম্ভবত আরও অনেক উপায় আছে

Question 11

.add_to_cart >>> .form-item:eq(1)

.add_to_cart থেকে ট্রি স্তরের শিশুটিতে দ্বিতীয়