উত্তর:
JQuery কনস্ট্রাক্টর নামে পরিচিত একটি 2 য় প্যারামিটার গ্রহণ করে context
যা নির্বাচনের প্রসঙ্গে ওভাররাইড করতে ব্যবহার করা যেতে পারে।
jQuery("img", this);
এটি এর মতো ব্যবহারের .find()
মতো যা একই :
jQuery(this).find("img");
আপনি যে ইমগগুলি চান তা যদি কেবল ক্লিক করা উপাদানের সরাসরি বংশধর হয় তবে আপনি এটি ব্যবহার করতে পারেন .children()
:
jQuery(this).children("img");
আপনি ব্যবহার করতে পারে
$(this).find('img');
যা all img
শ্বরের বংশধর সকলকে ফিরিয়ে দেবেdiv
$(this).children('img')
আরও ভাল হবে। উদাহরণস্বরূপ <div><img src="..." /><div><img src="..." /></div></div>
কারণ সম্ভবত ব্যবহারকারী 1 ম স্তরের ইমগগুলি সন্ধান করতে চান।
আপনার যদি প্রথমটি পেতে হয় তবে এটি img
এক স্তরের নীচে ঠিক আছে, আপনি এটি করতে পারেন
$(this).children("img:first")
.children()
এখান থেকেই "নীচে ঠিক এক স্তর" এসেছে এবং :first
সেখানেই "প্রথম" এসেছে।
.find()
পরিবর্তে.children()
this
একটি রেফারেন্স ইতিমধ্যে ছিল <div>
ধারণকারী <img>
অবশ্য যদি তোমরা রেফারেন্স আপনি স্পষ্টভাবে পারা স্পষ্টভাবে রচনা একটির বেশি তারপর ছিল থেকে তর্ক করতে ট্যাগের একাধিক মাত্রার children()
কল
যদি আপনার ডিআইভি ট্যাগটি অবিলম্বে আইএমজি ট্যাগ অনুসরণ করে তবে আপনি এটি ব্যবহার করতে পারেন:
$(this).next();
সরাসরি বাচ্চারা
$('> .child-class', this)
আপনি নীচের মতো পিতামহী বিভাগের সমস্ত img উপাদান খুঁজে পেতে পারেন
$(this).find('img') or $(this).children('img')
আপনি যদি নির্দিষ্ট আইএমজি উপাদান চান তবে আপনি এটি লিখতে পারেন write
$(this).children('img:nth(n)')
// where n is the child place in parent list start from 0 onwards
আপনার ডিভিতে কেবলমাত্র একটি আইএমজি উপাদান রয়েছে। সুতরাং এই জন্য নীচে সঠিক
$(this).find("img").attr("alt")
OR
$(this).children("img").attr("alt")
তবে আপনার ডিভিতে যদি নীচের মতো আরও আইএমজি উপাদান থাকে
<div class="mydiv">
<img src="test.png" alt="3">
<img src="test.png" alt="4">
</div>
তারপরে আপনি দ্বিতীয় img উপাদানটির Alt মান খুঁজে পেতে উচ্চতর কোড ব্যবহার করতে পারবেন না। সুতরাং আপনি এটি চেষ্টা করতে পারেন:
$(this).find("img:last-child").attr("alt")
OR
$(this).children("img:last-child").attr("alt")
এই উদাহরণটি একটি সাধারণ ধারণা দেখায় যে আপনি কীভাবে প্যারেন্ট অবজেক্টের মধ্যে প্রকৃত অবজেক্টটি সন্ধান করতে পারেন। আপনি আপনার সন্তানের বিষয়টিকে আলাদা করতে ক্লাস ব্যবহার করতে পারেন। এটি সহজ এবং মজাদার। অর্থাত
<div class="mydiv">
<img class='first' src="test.png" alt="3">
<img class='second' src="test.png" alt="4">
</div>
আপনি নীচের মত এটি করতে পারেন:
$(this).find(".first").attr("alt")
এবং আরও নির্দিষ্ট হিসাবে:
$(this).find("img.first").attr("alt")
আপনি উপরের কোড হিসাবে বাচ্চাদের সন্ধান করতে পারেন। আরও দেখার জন্য শিশুদের http://api.jquery.com/children/ এবং http://api.jquery.com/find/ দেখুন । উদাহরণ দেখুন http://jsfiddle.net/lalitjs/Nx8a6/
JQuery এ কোনও শিশুকে উল্লেখ করার উপায়। আমি নিম্নলিখিত jQuery এ সংক্ষিপ্তসার:
$(this).find("img"); // any img tag child or grandchild etc...
$(this).children("img"); //any img tag child that is direct descendant
$(this).find("img:first") //any img tag first child or first grandchild etc...
$(this).children("img:first") //the first img tag child that is direct descendant
$(this).children("img:nth-child(1)") //the img is first direct descendant child
$(this).next(); //the img is first direct descendant child
ডিআইভির আইডি না জেনে আমি মনে করি আপনি এইভাবে আইএমজি নির্বাচন করতে পারেন:
$("#"+$(this).attr("id")+" img:first")
এই কোড ব্যবহার করে দেখুন:
$(this).children()[0]
$($(this).children()[0])
।
$(this:first-child)
$($(this).children()[x])
ব্যবহারের পরিবর্তে $(this).eq(x)
বা যদি আপনি প্রথমটি চান, ঠিক $(this).first()
।
আপনি নিম্নলিখিত যে কোনও একটি পদ্ধতি ব্যবহার করতে পারেন:
1 সন্ধান ():
$(this).find('img');
2 শিশু ():
$(this).children('img');
jQuery এর each
একটি বিকল্প:
<div id="test">
<img src="testing.png"/>
<img src="testing1.png"/>
</div>
$('#test img').each(function(){
console.log($(this).attr('src'));
});
আপনি পিতামাতার মধ্যে উপলব্ধ শিশু উপাদানগুলি উল্লেখ করতে চাইল্ড সেলেকার ব্যবহার করতে পারেন ।
$(' > img', this).attr("src");
নীচেরটি হল যদি আপনার কাছে রেফারেন্স না থাকে $(this)
এবং আপনি অন্য ফাংশন থেকে একটিতে img
উপলব্ধ রেফারেন্স চান div
।
$('#divid > img').attr("src");
এখানে একটি কার্যকরী কোড রয়েছে, আপনি এটি চালাতে পারেন (এটি একটি সাধারণ বিক্ষোভ)।
আপনি যখন ডিআইভিতে ক্লিক করেন আপনি কিছু ভিন্ন পদ্ধতি থেকে চিত্রটি পান, এই পরিস্থিতিতে "এটি" হ'ল ডিআইভি।
$(document).ready(function() {
// When you click the DIV, you take it with "this"
$('#my_div').click(function() {
console.info('Initializing the tests..');
console.log('Method #1: '+$(this).children('img'));
console.log('Method #2: '+$(this).find('img'));
// Here, i'm selecting the first ocorrence of <IMG>
console.log('Method #3: '+$(this).find('img:eq(0)'));
});
});
.the_div{
background-color: yellow;
width: 100%;
height: 200px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="my_div" class="the_div">
<img src="...">
</div>
আশা করি এটা সাহায্য করবে!
আপনার নিজের <img>
ভিতরে 0 থেকে অনেকগুলি ট্যাগ থাকতে পারে <div>
।
একটি উপাদান খুঁজে পেতে, ব্যবহার করুন .find()
।
আপনার কোডটি সুরক্ষিত রাখতে, একটি ব্যবহার করুন .each()
।
একাধিক উপাদান হ্যান্ডলিং করার অনুমতি দেয় এবং 0 টি উপাদানের ক্ষেত্রে নাল রেফারেন্স ত্রুটিগুলি ব্যবহার .find()
এবং .each()
একসাথে প্রতিরোধ করে।<img>
<img>
// Set the click handler on your div
$("body").off("click", "#mydiv").on("click", "#mydiv", function() {
// Find the image using.find() and .each()
$(this).find("img").each(function() {
var img = this; // "this" is, now, scoped to the image element
// Do something with the image
$(this).animate({
width: ($(this).width() > 100 ? 100 : $(this).width() + 100) + "px"
}, 500);
});
});
#mydiv {
text-align: center;
vertical-align: middle;
background-color: #000000;
cursor: pointer;
padding: 50px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="mydiv">
<img src="" width="100" height="100"/>
</div>
$("body").off("click", "#mydiv").on("click", "#mydiv", function() {
event.stopImmediatePropagation()
ঘটতে রোধ করার জন্য আমি উপাদানটি ব্যবহার করে ক্ষতবিক্ষত করেছি ।
$(document).ready(function() {
// When you click the DIV, you take it with "this"
$('#my_div').click(function() {
console.info('Initializing the tests..');
console.log('Method #1: '+$(this).children('img'));
console.log('Method #2: '+$(this).find('img'));
// Here, i'm selecting the first ocorrence of <IMG>
console.log('Method #3: '+$(this).find('img:eq(0)'));
});
});
.the_div{
background-color: yellow;
width: 100%;
height: 200px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="my_div" class="the_div">
<img src="...">
</div>
আপনি ব্যবহার করতে পারেন
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
$(this).find('img');
</script>
আপনার আইএমজি যদি ডিভের ভিতরে ঠিক প্রথম উপাদান হয় তবে চেষ্টা করুন
$(this.firstChild);