JavaScript / jQuery ตัวเลือก DOM

jQuery vs JavaScript

jQuery 由 John Resig 于 2006 年创建。它旨在处理浏览器不兼容性并简化 HTML DOM 操作、事件处理、动画和 Ajax。

十多年来,jQuery 一直是世界上最受欢迎的 JavaScript 库。

但是,在 JavaScript Version 5(2009)之后,大多数 jQuery 实用程序都可以通过几行标准 JavaScript 来解决:

通过 id 来查找 HTML 元素

返回 id="intro" 的元素:

jQuery

var myElement = $("#id01");

ทดสอบด้วยตัวเอง

JavaScript

var myElement = document.getElementById("id01");

ทดสอบด้วยตัวเอง

通过标签名来查找 HTML 元素

返回所有 <p> 元素:

jQuery

var myElements = $("p");

ทดสอบด้วยตัวเอง

ตัวอย่าง

var myElements = document.getElementsByTagName("p");

ทดสอบด้วยตัวเอง

ค้นหาองค์ประกอบ HTML ผ่านชื่อคลาส

กลับค่าทั้งหมดขององค์ประกอบที่มี class="intro"

jQuery

var myElements = $(".intro");

ทดสอบด้วยตัวเอง

JavaScript

var myElements = document.getElementsByClassName("intro");

ทดสอบด้วยตัวเอง

วิธีไม่ทำงานใน Internet Explorer 8 และรุ่นเก่ากว่า

ค้นหาองค์ประกอบ HTML ผ่านตัวเลือก CSS

กลับค่ารายชื่อทั้งหมดของ <p> ที่มี class="intro"

jQuery

var myElements = $("p.intro");

ทดสอบด้วยตัวเอง

JavaScript

var myElements = document.querySelectorAll("p.intro");

ทดสอบด้วยตัวเอง

querySelectorAll() วิธีไม่ทำงานใน Internet Explorer 8 และรุ่นเก่ากว่า