কম্পিউটার টিউটোরিয়াল

জাভাস্ক্রিপ্টে ইউজার ইনপুট থেকে নম্বর নিয়ে কনসোলে দেখানোর পদ্ধতি


আপনি # ব্যবহার করে ভ্যালু পেতে পারেন যখন ইউজার বাটনে ক্লিক করবে document.querySelector() ব্যবহার করে। জাভাস্ক্রিপ্ট কোড নিচে দেওয়া হলো −

উদাহরণ

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> </head> <body> <div class="container container-fluid"> <p><strong> Example:</strong> choose a number between 1 to 100</p> <form> <div class="form-group"> <label for="number">Give a number:</label> <input id="inputNumber" value="" type="text" name="number" /> </form> <p id="output"></p> </div> <button class="btn btn-dark" id="choose" type="submit">Click Me</button> </body> <script>    function example() {       let btn = document.querySelector("#choose");       let randomNumber = Math.ceil(Math.random() * 100);       btn.onclick = function() {          let givenNumber = document.querySelector("#inputNumber").value;          let valueInt = parseInt(givenNumber, 100);          console.log(randomNumber, givenNumber);       };    }    example(); </script> </html>

উপরোক্ত প্রোগ্রাম চালাতে, ফাইলের নাম anyName.html(index.html) হিসেবে সেভ করুন এবং ফাইলে রাইট-ক্লিক করে VS Code এডিটরে "Open with Live Server" অপশন সিলেক্ট করুন।

আউটপুট

জাভাস্ক্রিপ্টে ইউজার ইনপুট থেকে নম্বর নিয়ে কনসোলে দেখানোর পদ্ধতি

একটি মান যোগ করুন −

জাভাস্ক্রিপ্টে ইউজার ইনপুট থেকে নম্বর নিয়ে কনসোলে দেখানোর পদ্ধতি

"Click Me" বাটনে ক্লিক করলে কনসোলে একই জিনিস দেখা যাবে −

জাভাস্ক্রিপ্টে ইউজার ইনপুট থেকে নম্বর নিয়ে কনসোলে দেখানোর পদ্ধতি

  1. জাভাস্ক্রিপ্টে স্প্যান ট্যাগ থেকে প্রাইস ভ্যালু বের করে গুণফল দেখানো

  2. জাভাস্ক্রিপ্টে tr ট্যাগ থেকে id বের করে নতুন td-তে দেখানো

  3. জাভাস্ক্রিপ্টে HTML ইনপুট গ্রহণ, পার্স ও প্রদর্শন করা

  4. জাভাস্ক্রিপ্ট দিয়ে CSS ভেরিয়েবল (কাস্টম প্রোপার্টি) গেট ও সেট করা