สามารถทำได้โดยใช้เมธอด shift ตัวอย่างเช่น: ตัวอย่าง let veggies = ["Onion", "Raddish"]; veggies.shift(); console.log(veggies); ผลลัพธ์ จะได้ผลลัพธ์ดังนี้: ["Raddish"]

บางครั้งต้องการลบสมาชิกจากตำแหน่งที่กำหนดในอาร์เรย์ JavaScript มีเมธอด splice สำหรับลบจากดัชนีที่กำหนด ใช้งานได้ดังนี้: ตัวอย่าง let veggies = ["Onion", "Raddish", "Broccoli"]; veggies.splice(0, 1); // ลบ 1 สมาชิกจากดัชนี 0 console.log(veggies); ผลลัพธ์ จะได้ผลลัพธ์ด

มีสองวิธีในการรวมอาร์เรย์ 2 อาร์เรย์ใน JavaScript หากต้องการได้อาร์เรย์ใหม่และไม่ต้องการเปลี่ยนแปลงอาร์เรย์เดิม ให้ใช้เมธอด concat ดังนี้: ตัวอย่าง let arr1 = [1, 2, 3, 4]; let arr2 = [5, 6, 7, 8]; let arr3 = arr1.concat(arr2); console.log(arr1); console.log(arr2); console.log(arr3); ผลลัพธ์ จ

ใช้คลาส .clearfix เพื่อล้าง float ของ element ใดๆ ใน Bootstrap ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อนำ clearfix class ไปใช้งาน: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href = "/bootstrap/css/bootstrap.min.css" rel = &qu

ใช้คลาส .btn-group เพื่อจัดกลุ่มปุ่มใน Bootstrap ลองรันโค้ดต่อไปนี้เพื่อสร้างกลุ่มปุ่ม ตัวอย่าง <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet">

Split button dropdowns ใช้สไตล์เหมือน dropdown button แต่เพิ่ม primary action พร้อมกับ dropdown Split buttons จะมี primary action ด้านซ้ายและ toggle ด้านขวาที่แสดง dropdown ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อสร้าง split button dropdowns: <!DOCTYPE html> <html> <head> <titl

เพื่อ wrap สตริงข้อความใน element ให้ใช้คลาส .navbar-text ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อตั้งค่าข้อความใน Bootstrap Navbar: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href = "/bootstrap/css/bootstrap.min.css" rel = &

เพื่อจัดตำแหน่งองค์ประกอบ เช่น nav links, forms, buttons, หรือ text ให้อยู่ซ้ายหรือขวาใน navbar ให้ใช้ utility classes .navbar-left หรือ .navbar-right ทั้งสองคลาสจะเพิ่ม CSS float ตามทิศทางที่ระบุ ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อจัดตำแหน่งองค์ประกอบ: <!DOCTYPE html> <html> <head&g

เพื่อสร้าง navbar แบบกลับสี (inverted) ที่มีพื้นหลังสีดำและข้อความสีขาว ให้เพิ่มคลาส .navbar-inverse ไปยังคลาส .navbar ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อนำ navbar-inverse ไปใช้งาน: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href

เพื่อใช้งานคลาส table-striped ใน Bootstrap ให้เพิ่มคลาสนี้ไปยัง element <table> ตัวอย่าง <!DOCTYPE html> <html> <head> <title>Bootstrap Table</title> <meta name ="viewport" content = "width = device-width, initial-scale = 1">

เพื่อซ่อนองค์ประกอบใน Bootstrap ให้ใช้คลาส .hidden ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อซ่อนคลาส: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet"> &

เพื่อให้ Jumbotron มีความกว้างเต็มหน้าจอและไม่มีมุมโค้ง ให้วางคลาส .jumbotron ไว้นอกคลาส .container ทั้งหมด และเพิ่ม .container ไว้ภายในแทน ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อนำไปใช้งาน: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link

Labels เหมาะสำหรับแสดงจำนวนนับ เคล็ดลับ หรือเครื่องหมายอื่นๆ ในหน้าเว็บ ตัวอย่าง ใช้คลาส .label เพื่อแสดง labels ลองรันโค้ดต่อไปนี้: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href = "/bootstrap/css/bootstrap.min.css"

Bootstrap Contextual Classes ช่วยให้คุณเปลี่ยนสีพื้นหลังของแถวตาราง (<tr>) หรือเซลล์เดี่ยว (<td>, <th>) ได้ คลาสที่มีอยู่: คลาส คำอธิบาย .active ใช้สี hover ให้กับแถวหรือเซลล์เฉพาะ .success บ่งบอกการดำเนินการที่สำเร็จหรือบวก .warning บ่งบอกคำเตือนที่อาจต้องให้ความสนใจ

Bootstrap มีสไตล์สำหรับแสดงสถานะการตรวจสอบความถูกต้อง ได้แก่ ข้อผิดพลาด (error), คำเตือน (warning), และสำเร็จ (success) เพื่อใช้งาน ให้เพิ่มคลาสที่เหมาะสม (.has-warning, .has-error, หรือ .has-success) ไปยัง element พาเรนต์ ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อนำ validation states ไปใช้งาน: <!DOCTYPE

Element <select> ใช้เมื่อต้องการให้ผู้ใช้เลือกจากหลายตัวเลือก โดยค่าเริ่มต้นจะอนุญาตให้เลือกได้เพียงตัวเลือกเดียว ใช้ <select> สำหรับรายการตัวเลือกที่ผู้ใช้คุ้นเคย เช่น จังหวัด หรือตัวเลข ใช้ multiple="multiple" เพื่ออนุญาตให้ผู้ใช้เลือกได้หลายตัวเลือกพร้อมกัน ตัวอย่าง ลองรั

ใช้คลาสอย่าง .input-lg และ .col-lg-* เพื่อกำหนดความสูงและความกว้างของฟอร์ม ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อตั้งค่าความสูงและความกว้างของฟอร์ม: <!DOCTYPE html> <html> <head> <title>Bootstrap Example</title> <link href = "/bootstrap/css/bootstrap.min

Element <textarea> ใช้เมื่อต้องการรับข้อมูลหลายบรรทัด ลองรันโค้ดตัวอย่างด้านล่างเพื่อเรียนรู้การใช้งาน textarea ใน Bootstrap Forms ตัวอย่าง <!DOCTYPE html> <html> <head> <title>Bootstrap Forms</title> <meta name = "viewport" content=&quo

หากต้องการปรับขนาดปุ่มใน Bootstrap สามารถใช้คลาสต่อไปนี้ได้: คลาส คำอธิบาย .btn-lg ทำให้ปุ่มมีขนาดใหญ่ (Large) .btn-sm ทำให้ปุ่มมีขนาดเล็ก (Small) .btn-xs ทำให้ปุ่มมีขนาดเล็กมาก (Extra Small) .btn-block สร้างปุ่มแบบบล็อกที่ยืดเต็มความกว้างของพาเรนต์ ตัวอย่าง ลองรันโค้ดต่อไปนี้เพื่อส

ใช้คลาส img-rounded ของ Bootstrap เพื่อจัดสไตล์รูปภาพและทำให้มีมุมโค้งมน ตัวอย่าง <!DOCTYPE html> <html> <head> <title>Bootstrap Images</title> <link href = "/bootstrap/css/bootstrap.min.css" rel = "stylesheet"> <script sr