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 和早期版本中不起作用。

通過 CSS 選擇器查找 HTML 元素

返回包含 class="intro" 的所有 <p> 元素的列表。

jQuery

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

親自試一試

JavaScript

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

親自試一試

querySelectorAll() 方法在 Internet Explorer 8 和早期版本中不起作用。