জাভাস্ক্রিপ্টে নোডের সাথে কাজ

আপনি যেমন জানেন, ট্যাগগুলিতে অন্যান্য ট্যাগ থাকতে পারে অথবা, জাভাস্ক্রিপ্টের পরিভাষায় বলতে গেলে, DOM এলিমেন্টগুলিতে অন্যান্য DOM এলিমেন্ট থাকতে পারে। এছাড়াও, তবে, এগুলিতে মন্তব্য এবং সাধারণ পাঠ্য থাকতে পারে। মন্তব্য, পাঠ্য এবং DOM এলিমেন্টগুলিকে একটি নামে একত্রিত করা হয় - নোড।

আপনি ইতিমধ্যেই firstElementChild, lastElementChild, nextElementSibling, previousElementSibling বৈশিষ্ট্যগুলির সাথে পরিচিত। এই বৈশিষ্ট্যগুলি বিশেষভাবে DOM এলিমেন্টগুলির সাথে কাজ করে, অন্যান্য নোডগুলিকে উপেক্ষা করে। একটি নিয়ম হিসাবে, এটি সাধারণত আমাদের যা প্রয়োজন তা হয়।

যাইহোক, firstChild, lastChild, nextSibling, previousSibling বৈশিষ্ট্যগুলিও বিদ্যমান। এই বৈশিষ্ট্যগুলি একইভাবে কাজ করে, যাইহোক, সমস্ত নোড বিবেচনা করে। আসুন একটি উদাহরণের মাধ্যমে এই বৈশিষ্ট্যগুলির মধ্যে পার্থক্য দেখি। ধরুন আমাদের কাছে একটি div আছে যার মধ্যে তিনটি নোড রয়েছে:

html<div id="elem"><!--com-->text<span>tag</span></div>

চলুন এই div-টির একটি রেফারেন্স একটি ভেরিয়েবলে পাই:

javascriptlet elem = document.querySelector('#elem');

এবং এখন চলুন দেখি firstChild এবং firstElementChild বৈশিষ্ট্যগুলিতে কী রয়েছে:

javascriptconsole.log(elem.firstChild);        // মন্তব্য
console.log(elem.firstElementChild); // span ট্যাগ