องค์ประกอบการดำเนินงานและองค์ประกอบการวางตำแหน่งโดยใช้ JS เพื่อนำไปใช้เป็นตัวเลือกที่ดี มีตัวอย่างด้านล่าง เพื่อนที่ต้องการมันสามารถดูได้
<! doctype html> <html> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <title> อินสแตนซ์ JavaScript หนึ่งอินสแตนซ์ต่อวัน } div {border: 1px solid #000; Padding: 10px; } #Cursor {ตำแหน่ง: สัมบูรณ์; พื้นหลังสี:#ff0; ความกว้าง: 20px; ความสูง: 20px; ซ้าย: 50px; ด้านบน: 300px; } </style> <script> function positionObject (obj) {var rect = obj.getBoundingClientRect (); return [rect.left, rect.top]; } window.onload = function () {var tst = document.documentelement.getBoundingClientRect (); การแจ้งเตือน (tst.top); var cont = 'a'; var cursor = document.getElementById ("เคอร์เซอร์"); ในขณะที่ (cont) {cont = prompt ("คุณต้องการย้ายบล็อกเคอร์เซอร์ที่ไหน?", "a"); if (cont) {cont = cont.toLowerCase (); if (cont == "a" || cont == "b" || cont == "c") {var elem = document.getElementById (ต่อ); var pos = positionObject (elem); console.log (POS); Cursor.setAttribute ("Style", "Top:"+POS [1]+"PX;"+"ซ้าย:"+POS [0]+"PX"); }}}}} </script> </head> <body> <div id = "a"> <p> a </p> <div id = "b"> <p> b </p> <div id = "c"> <p> c </p> </div> </div>