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

HTML DOM Map অবজেক্ট

HTML DOM Map অবজেক্ট HTML-এ <map> এলিমেন্টকে প্রতিনিধিত্ব করে।

সিনট্যাক্স

নিচে সিনট্যাক্স দেওয়া হলো:

<map> এলিমেন্ট তৈরি করা

var mapObject = document.createElement(“MAP”)

প্রোপার্টি

এখানে, “mapObject” নিচের কালেকশন ও প্রোপার্টিগুলো 가질 수 있습니다:

কালেকশন/ প্রোপার্টি বিবরণ
areas এটি সব <area> এলিমেন্টের একটি কালেকশন রিটার্ন করে
images এটি সব <img> & <object> এলিমেন্টের একটি কালেকশন রিটার্ন করে
name এটি <map> এলিমেন্টের name অ্যাট্রিবিউটের মান সেট/রিটার্ন করে

উদাহরণ

Map areas কালেকশনের জন্য একটি উদাহরণ দেখি:

<!DOCTYPE html> <html> <head> <title>Map areas collection</title> <style>    form {       width:70%;       margin: 0 auto;       text-align: center;    }    * {       padding: 2px;       margin:5px;    }    input[type="button"] {       border-radius: 10px;    } </style> </head> <body> <form> <fieldset> <legend>Map-areas-collection</legend> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/fb/New7Wonders.jpg/276px-New7Wonders.jpg" width="250" height="150" usemap="#7Wonders"> <map id="WonderWorld" name="7Wonders"> </map> <div id="divDisplay"></div> <input type="button" value="Apply Link" onclick="myWonder()"> </fieldset> </form> <script>    function myWonder() {       var divDisplay = document.getElementById("divDisplay");       var newArea = document.createElement("AREA");       newArea.setAttribute("href", "https://en.wikipedia.org/wiki/Giza_pyramid_complex");       newArea.setAttribute("shape", "rect");       newArea.setAttribute("coords", "120,10,10,40");       document.getElementById("WonderWorld").appendChild(newArea);       divDisplay.textContent = "Link was applied, hover and click on pyramid of giza.";    } </script> </body> </html>

আউটপুট

এটি নিচের আউটপুট দেবে:

『Apply Link』 বাটনে ক্লিক করার আগে:

HTML DOM Map অবজেক্ট

『Apply Link』 বাটনে ক্লিক করার পর:

HTML DOM Map অবজেক্ট


  1. HTML DOM Bold অবজেক্ট

  2. HTML DOM DD অবজেক্ট

  3. HTML DOM HR অবজেক্ট

  4. HTML DOM Ul অবজেক্ট