কম্পিউটার

জাভাস্ক্রিপ্ট ব্যবহার করে একটি উপাদানের ভিতরে পাঠ্য নির্বাচন এবং অনির্বাচন করুন


জাভাস্ক্রিপ্ট -

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .result {
      font-size: 20px;
      font-weight: 500;
   }
</style>
</head>
<body>
<h1>Select and Deselect Text Inside an Element</h1>
<div style="color: green;" class="result">
Here is some text inside the div
</div>
<button class="Btn">SELECT</button>
<button class="Btn">DESELECT</button>
<h3>Click on the above button to select/de-select text inside the div</h3>
<script>
   let resEle = document.querySelector(".result");
   let BtnEle = document.querySelectorAll(".Btn");
   BtnEle[0].addEventListener("click", () => {
      window.getSelection().selectAllChildren(resEle);
   });
   BtnEle[1].addEventListener("click", () => {
      window.getSelection().removeAllRanges();
   });
</script>
</body>
</html>

আউটপুট

উপরের কোডটি নিম্নলিখিত আউটপুট −

তৈরি করবে

জাভাস্ক্রিপ্ট ব্যবহার করে একটি উপাদানের ভিতরে পাঠ্য নির্বাচন এবং অনির্বাচন করুন

'সিলেক্ট' বোতামে ক্লিক করলে -

জাভাস্ক্রিপ্ট ব্যবহার করে একটি উপাদানের ভিতরে পাঠ্য নির্বাচন এবং অনির্বাচন করুন

'DESELECT' বোতামে ক্লিক করলে -

জাভাস্ক্রিপ্ট ব্যবহার করে একটি উপাদানের ভিতরে পাঠ্য নির্বাচন এবং অনির্বাচন করুন


  1. ভ্যানিলা জাভাস্ক্রিপ্ট ব্যবহার করে বোতামের ক্লিকে একটি ডিভ উপাদানে অ্যারে আইটেমগুলি প্রদর্শন করুন

  2. জাভাস্ক্রিপ্ট সহ একটি ওয়েব পৃষ্ঠায় উপাদান ট্যাগের ভিতরে নেই এমন কোনও পাঠ্য সরান?

  3. জাভাস্ক্রিপ্ট দিয়ে টেক্সট বক্স নির্বাচন করা কি সম্ভব?

  4. CSS ব্যবহার করে একটি উপাদানের সর্বনিম্ন-প্রস্থ এবং সর্বোচ্চ-প্রস্থ সেট করুন