JQuery ব্যবহার করে দ্বিতীয় সন্তান পান


187
$(t).html()

আয়

<td>test1</td><td>test2</td>

আমি বস্তুটি tdথেকে দ্বিতীয়টি পুনরুদ্ধার করতে চাই $(t)। আমি একটি সমাধান অনুসন্ধান করেছি কিন্তু কিছুই আমার পক্ষে কার্যকর হয়নি। দ্বিতীয় ধারণাটি কীভাবে পাবেন?

উত্তর:


349

দ্বিতীয় সন্তান ধরুন:

$(t).children().eq(1);

বা, দ্বিতীয় সন্তানকে ধরুন <td>:

$(t).children('td').eq(1);

2
$(t).children('td').eq(1)এবং এর মধ্যে পার্থক্য কী$(t).children()[1]
সবুজ লেই

6
@ গ্রিনলি ভালভাবে শুরু করার জন্য প্রথমে একটি জিকুয়েরি বস্তু দেয়, দ্বিতীয়টি নোড অবজেক্ট দেয়
অ্যান্টনিগোর

2
এটি কি find()jQuery পদ্ধতিতে কাজ করে? মতই $(t).find('td').eq(1)দ্বিতীয় পেতে <td>, যদি tএকটা টেবিল ছিল, বলে, এবং আমি চেয়ে বেশি 1 নোড নিচে দেখুন প্রয়োজন?
জাস্টিন এল।

আমি .children('td').eq(1)কোনও কারণে কাজ করতে পারিনি , তবে .find('td').eq(1)ঠিক কাজ করেছি।
শার্পসি

27

এখানে এমন একটি সমাধান রয়েছে যা সম্ভবত কোডে পড়ার জন্য আরও স্পষ্ট:

আনর্ডারড তালিকার ২ য় সন্তান পেতে:

   $('ul:first-child').next()

এবং আরও বিশদযুক্ত উদাহরণ: এই কোডটি 'মাই_লিস্ট' হিসাবে চিহ্নিত উল-এর 2 য় শিশু উপাদানটির 'শিরোনাম' বৈশিষ্ট্যের পাঠ্য পেয়েছে:

   $('ul#my_list:first-child').next().attr("title")

এই দ্বিতীয় উদাহরণে, আপনি নির্বাচকের শুরুতে 'উল' থেকে মুক্তি পেতে পারেন , কারণ এটি অনর্থক, কারণ কোনও আইডি একক পৃষ্ঠায় অনন্য হওয়া উচিত। এটি কেবল উদাহরণে স্বচ্ছতা যোগ করার জন্য।

পারফরম্যান্স এবং মেমোরিতে নোট করুন , এই দুটি উদাহরণ ভাল পারফরম্যান্ট, কারণ তারা জেকুরি তৈরি করে না এমন উল উপাদানগুলির একটি তালিকা সংরক্ষণ করে যা পরে ফিল্টার করা উচিত।


আমরা পারফরম্যান্স সম্পর্কে যত্ন নেওয়ার সময়, আসুন এগিয়ে চলুন এবং একটি রেফারেন্স রাখি ulযাতে আমাদের এটির অনুসন্ধান করতে হবে না।
daniel1426

22

এটা কেমন:

$(t).first().next()

প্রধান আপডেট:

উত্তরটি দেখতে কত সুন্দর দেখাচ্ছে তা ছাড়া আপনার কোডটির পারফরম্যান্স সম্পর্কেও আপনাকে অবশ্যই একটি চিন্তা দিতে হবে। সুতরাং, পরিবর্তনশীলটির ঠিক কী আছে তা জানাও আপেক্ষিক $(t)। এটি একটি অ্যারে <TD>বা এটি একটি <TR>নোড এর <TD>sভিতরে বেশ কয়েকটি আছে? পয়েন্টটি আরও চিত্রিত করার জন্য, <ul>50 টি <li>শিশু সহ একটি তালিকায় jscreen স্কোরগুলি দেখুন :

http://jsperf.com/second-child-selector

$(t).first().next()পদ্ধতি দ্বারা পর্যন্ত, এখানে দ্রুততম হয়।

তবে, অন্যদিকে, আপনি যদি <tr>নোড নেন <td>এবং বাচ্চাদের সন্ধান করেন এবং একই পরীক্ষা চালান, ফলাফলগুলি একই রকম হবে না।

আশা করি এটা সাহায্য করবে. :)




8

JQuery পদ্ধতি ব্যবহার করা ছাড়াও, আপনি cellsযে <tr>দেশি সংগ্রহটি দেয় তা আপনি ব্যবহার করতে পারেন ।

$(t)[0].cells[1].innerHTML

ধরে tনেওয়া একটি ডিওএম উপাদান, আপনি jQuery অবজেক্ট তৈরিকে বাইপাস করতে পারেন।

t.cells[1].innerHTML

3

অবাক করে দিয়ে দেখেছি যে কেউই এর জন্য স্থানীয় জেএস উপায়ের উল্লেখ করেনি ..

JQuery ছাড়া:

কেবল পিতামাতার উপাদানটির childrenসম্পত্তি অ্যাক্সেস করুন । এটি শিশুদের উপাদানগুলির একটি লাইভ এইচটিএমএল সংগ্রহ সংগ্রহ করবে যা একটি সূচক দ্বারা অ্যাক্সেস করা যায়। যদি আপনি দ্বিতীয় সন্তান পেতে চান:

parentElement.children[1];

আপনার ক্ষেত্রে, এর মতো কিছু কাজ করতে পারে: (উদাহরণ)

var secondChild = document.querySelector('.parent').children[1];

console.log(secondChild); // <td>element two</td>
<table>
    <tr class="parent">
        <td>element one</td>
        <td>element two</td>
    </tr>
</table>

আপনি CSS3 নির্বাচনকারীদের / querySelector()এবং ব্যবহারের সংমিশ্রণটিও ব্যবহার করতে পারেন :nth-of-type()। এই পদ্ধতিটি কিছু ক্ষেত্রে আরও ভাল কাজ করতে পারে, কারণ আপনিও এ ক্ষেত্রে উপাদানটির ধরন নির্দিষ্ট করতে পারেন td:nth-of-type(2) (উদাহরণস্বরূপ)

var secondChild = document.querySelector('.parent > td:nth-of-type(2)');

console.log(secondChild); // <td>element two</td>

1

.find()পদ্ধতি ব্যবহার করুন

$(t).find("td:eq(1)");

td:eq(x) // x is index of child you want to retrieve. eq(1) means equal to 1. //1 denote second element


<table> <টি ক্লাস = "পিতামাতার"> <td> উপাদান এক </ strong> <td> উপাদান দুটি </

আপনার মন্তব্যের তথ্য যদি আপনার উত্তরের সাথে সম্পর্কিত হয় তবে দয়া করে সম্পাদনার মাধ্যমে আপনার পোস্টে বিশদ যুক্ত করুন। যেভাবেই হোক, দয়া করে আপনার মন্তব্য মুছুন।
মিকম্যাকুসা

1

নীচে দেওয়া হিসাবে আপনি jQuery এ দুটি পদ্ধতি ব্যবহার করতে পারেন-

JQuery ব্যবহার করে: নবম-বাচ্চার নির্বাচনকারী আপনি দ্বিতীয় লি উপাদান নির্বাচন করতে চাইলে আপনি কোনও উপাদানকে তার যুক্তি হিসাবে 2 হিসাবে রেখেছেন।

$( "ul li:nth-child(2)" ).click(function(){
  //do something
});

JQuery ব্যবহার করে: eq () নির্বাচক

আপনি যদি সঠিক উপাদানটি পেতে চান তবে আপনাকে আইটেমের সূচক মানটি নির্দিষ্ট করতে হবে। একটি তালিকার উপাদান সূচক 0 দিয়ে শুরু হয়। লি এর 2 য় উপাদান নির্বাচন করতে আপনাকে আর্গুমেন্ট হিসাবে 2 টি ব্যবহার করতে হবে।

$( "ul li:eq(1)" ).click(function(){
  //do something
});

উদাহরণ দেখুন: jQuery এ তালিকার দ্বিতীয় সন্তানের উপাদান পান

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.