一、如何在代碼中使用Jquery

進入Jquery官網，點擊Download Jquery

方法一、

直接在要使用jquery的網頁的head標簽內加入這以下代碼

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>

然后就可以開心的使用Jquery了。

方法二、

在標記的鏈接上郵件下載該文件，放入項目目錄中，然后在要使用Jquery的網頁中外部引入該文件下圖所示

二、DOM對象和Jquery對象

DOM對象（Document Object Model），每個DOM對象都可以將他的元素節點表示成一個樹狀的結構，dom可以用document.getElementByTagName或者getElemrntById或者querryselect()方法來獲取dom中的節點。像這樣得到的對象就是DOM對象

Jquery對象，一句話概括。Jquery包裝之后的DOM對象。

Jquery對象轉換DOM對象

$('#cr')[0]

Jquery對象是一個類數組對象

可以用下標來獲得DOM對象

DOM對象轉Jquery對象

div = document.querySelector('div')var $div = $(div)

?

二、Jquery強大的選擇器

2.1、基本選擇器

$('div') \\所有div元素節點 $('#id') \\id值為id的所有元素節點 $('.class') \\class值為class的所有元素節點 $('div,ul') \\所有div和ul的元素節點 $('*') \\全部元素節點

2.2、層級選擇器

$('div ul') \\所有作為div后代的ul元素節點 $('div>ul') \\所有div的直系后代ul元素節點 $('div+ul') \\緊跟在div元素節點之后的一個ul節點 $('div~ul') \\所有緊跟在div元素節點之后的ul節點

2.3、基本過濾選擇器

$(':first') \\選擇第一個 $(':last') \\選擇最后一個 $(':not()') \\選擇不被選擇的元素 $(':even') \\選擇偶數個 $(':odd') \\選擇奇數個 $(':eq(index)') \\選擇等于索引值的元素 $(':gt(index)') \\選擇大于索引值的元素 $(':lt(index)') \\選擇小于索引值的元素 $(':header') \\選擇所有的標題元素（h1，h2，h3等） $(':animated') \\選擇所有正在執行的動畫元素 $(':focus') \\選擇獲得焦點的元素

2.4、內容過濾選擇器

$('div:contains(text)') \\選擇含有text文本的div元素 $('div:empty') \\選擇不含子節點的div元素 $('div:has(p)') \\選擇含有p標簽的div標簽 $('div:parent') \\選擇非空節點的div元素

2.5、可見性過濾器

$(':hidden') \\選擇隱藏的不可見元素 $(':visible') \\選擇可見元素

2.6、子元素過濾器

$(':nth-child') \\ 選擇第n個子節點 $(':first-child') \\選擇第一個子節點 $(':last-child') \\ 選擇最后一個子節點 $(':only-child') \\ 只有一個子節點的元素

2.7、表單屬性過濾器

$(':enable') \\ 選擇可用節點 $(':disabled') \\ 選擇不可用節點 $(':checked') \\ 選擇被選中的節點（單選框，復選框） $(':selected') \\ 只有被選中的節點（下拉選擇框）

2.8、表單選擇器

$(':input') \\ 輸入框 $(':text') \\ 單行文本框 $(':password') \\ 密碼框 $(':radio') \\ 單選框 $(':checkbox') \\ 復選框 $(':submit') \\ 提交按鈕 $(':image') \\ 圖片提交按鈕 $(':reset') \\ 重置按鈕 $(':button') \\ 按鈕 $(':file') \\ 上傳域 $(':hidden') \\ 不可見元素

二、Jquery中的DOM操作

待更新。。。

總結

以上是生活随笔為你收集整理的锋利的Jquery的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。