Chrome DevTools এলিমেন্ট ইন্সপেক্টর থেকে পৃষ্ঠাটির উপাদানটিতে যান?


1

আমি একটি খুব বড় পাতা আছে। আমি DevTools এর উপাদান বিভাগে তাদের ক্লাসের নামের জন্য অনুসন্ধান করে উপাদান খুঁজে। আমি পৃষ্ঠায় ইন্সপেক্টর নির্বাচিত উপাদান ive খুঁজে পেতে হবে, কিন্তু পৃষ্ঠার আকার এই কঠিন করে তোলে।

একবার আপনি পৃষ্ঠাতে তার অবস্থান জাম্পিং এর পরিদর্শক একটি উপাদান নির্বাচন করেছেন একটি উপায় আছে?

উত্তর:


2

উপাদান পাঠ্য উপর ডান ক্লিক করুন, ক্লিক করুন "দেখুন স্ক্রোল করুন"।


2

ড্যানিয়েল এর উত্তর সম্ভবত সর্বাধিক সহজবোধ্য পদ্ধতি এবং আমি যা ব্যবহার করব তা যদি কিছুক্ষণের মধ্যেই করা হয়, তবে একটু জাভাস্ক্রিপ্ট দক্ষতার সাথে আমরা কনসোলে এটি কার্যকর করতে পারি কেন?

Chrome Dev সরঞ্জামগুলির কনসোল উইন্ডোতে নীচের লিখুন এবং টিপুন ENTER:

document.getElementsByClassName('ClassName')[0].scrollIntoView(true);

ব্যাখ্যা:

document.getElementsByClassName('ClassName') আপনি খুঁজছেন ক্লাসের নাম আছে যে সমস্ত উপাদান উদ্ধার।

দ্য [0] আপনি পুনরুদ্ধার করা উপাদান সংগ্রহের আইটেম অ্যাক্সেস করতে ব্যবহার করা হবে সূচক। কারণ এটি একটি শূন্য ভিত্তিক অ্যারে, [0] আপনি খুঁজছেন ক্লাসের নামের প্রথম উদাহরণ পায়।

অবশেষে, scrollIntoView(true) এটি ঠিক কী বলে, বিস্ময়করভাবে, উপাদানটিকে স্ক্রোল করে, যা এই ক্ষেত্রে প্রথম শ্রেণীর উপাদান যা "শ্রেণীনাম" এর ক্লাস নামটি দেখতে পারে। দ্য true পাস করা যুক্তি উইন্ডোটির শীর্ষে উপাদানটি সারিবদ্ধ করার পদ্ধতিটিকে বলে। false নীচে এটি সারিবদ্ধ হবে।

সুতরাং যদি আপনি নিজেকে বড় পৃষ্ঠাটির জন্য এই কাজটির পুনরাবৃত্তি খুঁজে পান তবে আপনি একবার বলছেন, আপনি একবার এই ফাংশনটি কার্যকর করতে পারেন UP কনসোল উইন্ডোতে, সূচী পরিবর্তন, ধোয়া এবং পুনরাবৃত্তি। তাই ভালো:

document.getElementsByClassName('ClassName')[0].scrollIntoView(true); //First item
document.getElementsByClassName('ClassName')[1].scrollIntoView(true); //Second item
document.getElementsByClassName('ClassName')[2].scrollIntoView(false); //Third item, aligned to the bottom of the screen

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


0

পূর্ববর্তী পোস্টার উত্তর সহ অন্য একটি কৌশল যা:

যদি আপনি কনসোলের সাথে কাজ করেন এবং কমান্ড লাইন থেকে অনুসন্ধান উপাদানগুলি ব্যবহার করেন, $[0] শেষ queried উপাদান আপ টান হবে। আপনি ডান ক্লিক করুন এবং নির্বাচন করতে পারেন reveal in elements panel, এবং তারপর ভিউ স্ক্রোলিং দ্বারা শেষ।

এটি বড় পৃষ্ঠাগুলিতে স্যানিটি এর gobs উপলব্ধ করা হয়।

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