Kayce Basques
Alexandra Klepper
ধরুন, আপনি একটি পৃষ্ঠার কীবোর্ড নেভিগেশন অ্যাক্সেসিবিলিটি পরীক্ষা করছেন। ট্যাব কী দিয়ে পৃষ্ঠাটি নেভিগেট করার সময়, ফোকাস রিংটি মাঝে মাঝে অদৃশ্য হয়ে যায় কারণ যে এলিমেন্টটিতে ফোকাস রয়েছে সেটি লুকানো থাকে। DevTools-এ ফোকাস করা এলিমেন্টটি ট্র্যাক করতে:
- কনসোলটি খুলুন।
ক্লিক করুন জীবন্ত অভিব্যক্তি তৈরি করুন ।
লাইভ এক্সপ্রেশন ব্যবহার করে রিয়েল-টাইমে জাভাস্ক্রিপ্ট ভ্যালু পর্যবেক্ষণ সম্পর্কে আরও জানুন।
document.activeElementটাইপ করুন।সংরক্ষণ করতে লাইভ এক্সপ্রেশন ইন্টারফেসের বাইরে ক্লিক করুন।
জীবন্ত অভিব্যক্তি তৈরি করুন । document.activeElement পরের মানটি হলো এক্সপ্রেশনটির ফলাফল। যেহেতু ওই এক্সপ্রেশনটি সবসময় ফোকাস করা এলিমেন্টকে নির্দেশ করে, তাই কোন এলিমেন্টটিতে ফোকাস আছে তার হিসাব রাখা যায়।
- ভিউপোর্টে ফোকাস করা এলিমেন্টটি হাইলাইট করতে ফলাফলের উপর মাউস রাখুন।
- ফলাফলের উপর রাইট-ক্লিক করুন এবং এলিমেন্টস প্যানেলে DOM ট্রি-তে এলিমেন্টটি দেখানোর জন্য 'ওপেন ইন এলিমেন্টস প্যানেল' নির্বাচন করুন।
- ফলাফলের উপর রাইট-ক্লিক করে ‘Store as global variable’ নির্বাচন করলে নোডটির একটি ভেরিয়েবল রেফারেন্স তৈরি হবে, যা আপনি কনসোলে ব্যবহার করতে পারবেন।