5.1 document.getElementById()
আপনি জানেন, জাভাস্ক্রিপ্ট এইচটিএমএল পৃষ্ঠাগুলিতে কিছু অ্যানিমেশন যোগ করার জন্য তৈরি করা হয়েছিল। এখন পর্যন্ত, আমরা এটি সম্পর্কে বেশি কিছু বলিনি। কিভাবে এই একই অ্যানিমেশন যোগ করতে? কিভাবে, উদাহরণস্বরূপ, একটি উপাদানের রঙ পরিবর্তন করতে?
একটি উপাদানের রঙ পরিবর্তন করতে, আপনাকে প্রথমে এই উপাদানটি খুঁজে বের করতে হবে। এটি করার জন্য, একটি ফাংশন রয়েছে যা আপনি পছন্দসই উপাদানে document.getElementById();আপনার HTML এ লিখুন এবং তারপরে জাভাস্ক্রিপ্ট থেকে এটি অ্যাক্সেস করুন। idউদাহরণ:
<head>
<script>
function changeImage()
{
var image = document.getElementById("image123");
image.src = "new-image.png";
}
</script>
</head>
<body>
<img id="image123" scr="big-image.png" onclick="changeImage()">
</body>
ব্যবহারকারী ছবিটিতে ক্লিক করার পরে, ফাংশনটিকে বলা হয় changeImge()। imageএর ভিতরে, আমরা এর দ্বারা উপাদানটি পাই IDএবং তারপরে এর src বৈশিষ্ট্যের মানটিকে একটি নতুন করে পরিবর্তন করি। যা উপাদানটিকে imgএকটি নতুন চিত্র লোড করবে।
5.2 document.createElement()
একটি উপাদান পাওয়ার পাশাপাশি, আমরা নতুন উপাদান তৈরি করতে এবং বিদ্যমানগুলি মুছে ফেলতে পারি।
উপাদান তৈরি করা খুব সহজ। এটি করার জন্য, আপনাকে দুটি জিনিস করতে হবে: ক) একটি উপাদান তৈরি করুন , খ) এটি নথিতে সঠিক জায়গায় যোগ করুন৷ এটি সাধারণত এই মত দেখায়:
<head>
<script>
window.onload = function () {
var image = document.createElement("IMG");
var image.src = "big-image.png";
document.body.addAfter(image);
}
</script>
</head>
<body>
</body>
5.3 window.navigate() পদ্ধতি
আরেকটি খুব দরকারী পদ্ধতি হল window.navigate(). এটির সাহায্যে, আপনি ব্রাউজারকে বর্তমানের পরিবর্তে একটি নতুন পৃষ্ঠা লোড করতে বাধ্য করতে পারেন। শুধু URLএই পদ্ধতিতে এটি পাস এবং এটি কল. উদাহরণ:
<body>
<img scr="big-image.png" onclick="window.navigate('https://google.com');">
</body>
উপরের উদাহরণে, ব্যবহারকারী ছবিটিতে ক্লিক করার পরে, google.com পৃষ্ঠাটি বর্তমান ট্যাবে লোড হবে।
5.4 বর্তমান URL
এবং আরও একটি দরকারী জিনিস। কখনও কখনও একটি স্ক্রিপ্ট বর্তমান পৃষ্ঠা URL জানতে প্রয়োজন. উদাহরণস্বরূপ, একই স্ক্রিপ্ট বিভিন্ন পৃষ্ঠায় যোগ করা যেতে পারে। এটা কিভাবে করতে হবে?
এই জন্য একটি বিশেষ সম্পত্তি আছে.document.location.href
var currentURL = document.location.href;
GO TO FULL VERSION