บทนำ Property borderBottomRightRadius ใช้สำหรับกำหนดรัศมีของมุมโค้งมุมล่างขวาของ element ทำให้มุมนั้นกลายเป็นมน ไม่ใช่มุมฉาก ตัวอย่างโค้ด <!DOCTYPE html> <html> <head> <style> #box { border: 2px dashed blue; width: 120px; height: 120px; } </s

บทนำ Property border ใน JavaScript เป็น shorthand property ที่รวม border-width, border-style, และ border-color ไว้ในคำสั่งเดียว ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <button onclick=display()>ตั้งค่าขอบ</button> <div id=box> <p>Demo Text</p&

บทนำ Property backgroundSize ใน JavaScript DOM ใช้ควบคุมขนาดของภาพพื้นหลัง สามารถกำหนดความกว้างและความสูงได้ทั้งค่าคงที่และเปอร์เซ็นต์ ตัวอย่างโค้ด <!DOCTYPE html> <html> <head> <style> #box { border: 2px dashed blue; width: 600px; height: 400px;

บทนำ แอตทริบิวต์ usemap ของแท็ก <img> ใช้เชื่อมโยงกับแท็ก <map> เพื่อสร้าง Image Map ใน JavaScript สามารถดึงค่านี้ได้ผ่าน property useMap (ตัว M ใหญ่) ของ HTMLImageElement ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <img id=myid src=/images/html.gif alt=HTML Map us

บทนำ Property borderLeftWidth ใน JavaScript DOM ใช้สำหรับตั้งค่าความหนาของขอบด้านซ้ายของ element แยกจากขอบด้านอื่นๆ ได้ ตัวอย่างโค้ด <!DOCTYPE html> <html> <head> <style> #box { border: thick solid gray; width: 300px; height: 300px; } </style

บทนำ Property pathname ของ HTMLAreaElement ช่วยให้ดึงเฉพาะส่วนพาธ (path) ของ URL ในแอตทริบิวต์ href ได้ โดยไม่รวม protocol, domain, query string หรือ hash ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <img src=/images/html.gif alt=HTML Map border=0 usemap=#html/> <map na

บทนำ JavaScript DOM มี property background ที่เป็น shorthand property ช่วยให้ตั้งค่าคุณสมบัติพื้นหลังหลายอย่างพร้อมกันในคำสั่งเดียว เช่น สี ภาพ ตำแหน่ง และการทำซ้ำ ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <button onclick=display()>คลิกเพื่อตั้งค่าพื้นหลัง</button>

บทนำ เมื่อแท็ก <area> มี href ที่ประกอบด้วย query string เช่น about.htm?id=company สามารถดึงเฉพาะส่วน query string ได้โดยใช้ property search ของ HTMLAreaElement ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <img src=/images/html.gif alt=HTML Map border=0 usemap=#html/>

บทนำ ใน JavaScript ฟังก์ชัน Number() ใช้สำหรับแปลงค่าต่างๆ ให้เป็นตัวเลข (Number type) เมื่อนำค่า 0 ไปแปลง ผลลัพธ์จะคืออะไร? ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <p>แปลง 0 เป็น Number</p> <script> var myVal = 0; document.write(Number: + Number(

บทนำ เมื่อต้องการให้ภาพพื้นหลังไม่เลื่อนตามเนื้อหาเมื่อผู้ใช้ scroll หน้าเว็บ สามารถใช้ property backgroundAttachment ของ JavaScript DOM ได้ property นี้ควบคุมพฤติกรรมของ background image ว่าจะคงที่หรือเลื่อนตามเนื้อหา ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <button onclic

บทนำ เมื่อทำงานกับแผนที่ภาพ (Image Map) ใน HTML โดยใช้แท็ก <area> บางครั้งเราต้องการดึงเฉพาะส่วนของแฮช (hash) จากแอตทริบิวต์ href เช่น about.htm#name โดย JavaScript มี property ชื่อ hash สำหรับวัตถุ HTMLAreaElement ที่ช่วยให้ทำได้ง่ายๆ ตัวอย่างโค้ด <!DOCTYPE html> <html> <body&

ลองรันโค้ดด้านล่างเพื่อดูผลลัพธ์เมื่อแปลงเลข 1 เป็น Boolean ใน JavaScript ตัวอย่าง <!DOCTYPE html> <html>    <body>       <p>แปลง 1 เป็น Boolean</p>       <script>          var myVal = 1;   &nb

ในการดึงค่าสีพื้นหลังใน JavaScript ให้ใช้คุณสมบัติ backgroundColor คุณสมบัตินี้ช่วยให้คุณอ่านค่าสีพื้นหลังได้ ตัวอย่าง ลองรันโค้ดด้านล่างเพื่อเรียนรู้วิธีดึงค่าสีพื้นหลังขององค์ประกอบด้วย JavaScript <!DOCTYPE html> <html>    <body>       <button onclick

ในการตั้งค่าภาพพื้นหลังใน JavaScript ให้ใช้คุณสมบัติ backgroundImage คุณสมบัตินี้ช่วยให้คุณกำหนดภาพพื้นหลังได้ ตัวอย่าง ลองรันโค้ดด้านล่างเพื่อเรียนรู้วิธีตั้งค่าภาพพื้นหลังด้วย JavaScript <!DOCTYPE html> <html>    <body>       <button onclick="dis

ใช้เมธอด parseInt() ใน JavaScript เพื่อแปลงสตริงให้เป็นจำนวนเต็ม (integer) คุณยังสามารถระบุระบบเลขฐาน (radix) เป็นพารามิเตอร์ที่สองได้อีกด้วย ตัวอย่าง ลองรันโค้ดด้านล่างเพื่อดูการทำงานของ parseInt() ใน JavaScript <!DOCTYPE html> <html>    <body>       <

ในการหาพิกัดของเคอร์เซอร์ใน JavaScript ให้ใช้ event.clientX และ event.clientY คุณสามารถลองรันโค้ดตัวอย่างด้านล่างเพื่อดูพิกัดของเคอร์เซอร์ได้ ตัวอย่าง <!DOCTYPE html> <html>    <head>       <script>          function coordina

เหตุการณ์ resize เหตุการณ์ที่เกิดขึ้นเมื่อผู้ใช้ปรับขนาดหน้าต่างเบราวเซอร์คือ resize สามารถผูก (attach) ไว้ที่อ็อบเจกต์ window ได้ วิธีการใช้งาน // วิธีที่ 1: ใช้ addEventListener (แนะนำ) window.addEventListener(resize, function() { console.log(ขนาดเปลี่ยน: + window.outerWidth + x + window.outer

คุณสมบัติ screenX และ screenY ใน JavaScript สามารถหาพิกัดของเคอร์เซอร์ (เมาส์) เทียบกับ **มุมซ้ายบนของหน้าจอ** (screen) ได้ผ่านคุณสมบัติ event.screenX และ event.screenY ของอ็อบเจกต์ Event ตัวอย่างโค้ด <!DOCTYPE html> <html> <head> <script> function coordinatesFunc(even

คุณสมบัติ target ใน JavaScript สามารถเข้าถึงค่าของแอตทริบิวต์ target ในแท็ก <a> (ลิงก์) ได้ผ่านคุณสมบัติ target ของอ็อบเจกต์ HTMLAnchorElement ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <p> <a id=qriesid target=_self href=https://qries.com/ type=text/html>Q

คุณสมบัติ type ใน JavaScript สามารถเข้าถึงค่าของแอตทริบิวต์ type ในแท็ก <a> (ลิงก์) ได้ผ่านคุณสมบัติ type ของอ็อบเจกต์ HTMLAnchorElement ตัวอย่างโค้ด <!DOCTYPE html> <html> <body> <p> <a id=qriesid href=https://qries.com/ type=text/html>Qries</a> &l