jQuery教程03-jQuery 元素、id、.class和*全选择器
生活随笔
收集整理的這篇文章主要介紹了
jQuery教程03-jQuery 元素、id、.class和*全选择器
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
jQuery 基礎選擇器
jQuery 選擇器允許您對 HTML 元素組或單個元素進行操作。
jQuery 選擇器基于元素的 id、類、類型、屬性、屬性值等"查找"（或選擇）HTML 元素。 它基于已經存在的 CSS 選擇器，除此之外，它還有一些自定義的選擇器。
jQuery 中所有選擇器都以美元符號開頭：$()。
1.元素選擇器
jQuery 元素選擇器基于元素名選取元素。
在頁面中選取所有 <p> 元素：
實例
用戶點擊按鈕后，所有 <p> 元素都隱藏：
<!DOCTYPE html> <html> <head><meta charset="utf-8"> <title>元素選擇器</title> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script><script>$(document).ready(function(){$("button").click(function(){$("p").hide();});});</script> </head> <body><h2>這是一個標題</h2><p>這是一個段落。</p><p>這是另一個段落。</p><button>點我</button> </body> </html>圖1：
圖2-單擊“點我”按鈕后的樣式：
2.id選擇器
jQuery #id 選擇器通過 HTML 元素的 id 屬性選取指定的元素。
頁面中元素的 id 應該是唯一的，所以您要在頁面中選取唯一的元素需要通過 #id 選擇器。
通過 id 選取元素語法如下：
實例
當用戶點擊按鈕后，有 id=“test” 屬性的元素將被隱藏：
圖1：
圖2-單擊“點我”按鈕后的樣式：
jQuery 類選擇器可以通過指定的 class 查找元素。
語法如下：。
實例
用戶點擊按鈕后所有帶有 class=“test” 屬性的元素都隱藏：
圖1：
圖2-單擊“點我”按鈕后的樣式：
4、*全選擇器
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>*全選擇器</title> <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script> <script>$(document).ready(function(){$("button").click(function(){$("*").hide();});}); </script> </head> <body><h2>這是標題</h2><p>這是一個段落。</p><p>這是另外一個段落。</p><button>點我</button> </body> </html>圖1：
圖2-單擊“點我”按鈕后的樣式：
總結
以上是生活随笔為你收集整理的jQuery教程03-jQuery 元素、id、.class和*全选择器的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 第六届省赛（软件类）真题----Java
- 下一篇： Oracle创建序列，删除序列