কম্পিউটার

জাভাস্ক্রিপ্ট:পৃষ্ঠা রিফ্রেশ করুন

কখনও কখনও আপনাকে JavaScript ব্যবহার করে একটি ওয়েবপৃষ্ঠা রিফ্রেশ করতে হবে। প্রয়োজন দেখা দিলে, reload() ব্যবহার করতে অবস্থান বস্তুটি ব্যবহার করুন পদ্ধতি

<!DOCTYPE html>
<html>
 
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>repl.it</title>
  <link href="style.css" rel="stylesheet" type="text/css" />
</head>
 
<body onload="handleLoad()">
  <button id="btn">Click Me!</button>
   <script>
     let arrayKittens = [ "https://placekitten.com/200/300", "https://placekitten.com/210/310", "https://placekitten.com/300/300", "https://placekitten.com/300/200", "https://placekitten.com/310/210", "https://placekitten.com/400/300"];
 
     let button = document.querySelector("#btn");
     button.style.display = "block";
     button.style.margin = '20px 0px'
 
     const handleClick = (e) => {
       console.log("click")
       location.reload(true);
     }
 
     button.addEventListener("click", handleClick);
 
 
     let body = document.querySelector("body");
     let image = document.createElement("img");
 
     const handleLoad = (e) => {
       console.log("loaded")
       let random = Math.floor(Math.random() * arrayKittens.length);
       let newImg = arrayKittens[random];
       image.setAttribute("src", newImg);
       image.setAttribute("width", "300");
       image.setAttribute("height", "300");
       image.setAttribute("alt", "  arrayKittens[" + random + "]");
       image.style.objectFit = "cover";
 
 
       body.appendChild(image);
     };
   </script>
 </body>
</html>

এই নথিতে দুটি ইভেন্ট শ্রোতা রয়েছে। প্রথমটি ঘটে যখন একটি <img /> যোগ করতে পৃষ্ঠাটি লোড হয় DOM-এর কাছে। দ্বিতীয়টিতে আমাদের reload() রয়েছে ফাংশন যখন একজন ব্যবহারকারী “ক্লিক মি!” এ ক্লিক করেন, তখন handleClick() ট্রিগার করে পৃষ্ঠাটি পুনরায় লোড হবে ফাংশন এই পৃষ্ঠাটি জাভাস্ক্রিপ্ট ব্যবহার করে আমাদের প্রায় সমস্ত যুক্তি পরিচালনা করতে।

এই বিশেষ উদাহরণে, প্রতিবার পৃষ্ঠাটি পুনরায় লোড করার সময় বিড়ালের ছবিগুলির একটি অ্যারের থেকে একটি এলোমেলো বিড়ালের ছবি প্রদর্শিত হবে।

পাস করা সত্য বা মিথ্যা মান নির্দেশ করবে যে পৃষ্ঠাটি সার্ভার থেকে বা ব্রাউজার ক্যাশে থেকে পুনরায় লোড হয়েছে কিনা। ডিফল্ট মানটি মিথ্যা, যা ক্যাশে থেকে পৃষ্ঠাটি পুনরায় লোড করে, তাই আপনি সার্ভার থেকে পৃষ্ঠাটি পুনরায় লোড করতে না চাইলে একটি মান পাস করার প্রয়োজন নেই৷

এটির মধ্যেই রয়েছে!


  1. জাভাস্ক্রিপ্টে ইমেজ() অবজেক্ট।

  2. জাভাস্ক্রিপ্ট ব্যবহার করে ক্যানভাসে একটি ছবি আঁকা

  3. জাভাস্ক্রিপ্টে আপলোড করার আগে একটি চিত্রের পূর্বরূপ দেখুন

  4. কিভাবে HTML পৃষ্ঠায় একটি চিত্র সন্নিবেশ করান?