jquery總結01 基本概念和選擇器

2022-07-26 18:03:14 字數 2507 閱讀 9763

dom元素和jquery元素的區別

dom元素支援dom元素自帶的屬性和方法,jquery元素支援jquery元素自帶的屬性和方法

dom                  var div = document.getelementbyid('a');

jquery                 var $div = $('#a');

dom轉jquery        var $a = $(div);

jquery轉dom         var a = $div[0] 或者var a = $div.get(0);

js會因為獲取不到元素而報錯,jquery不會。

jquery獲取的永遠是物件,所以判斷是否獲取到該元素用$().length或者$().[0]來判斷。

jquery選擇器

$(this)於this的區別

$(this) jquery的上下文物件 支援jquery的方法和屬性

this dom的上下文物件 支援jquery的方法和屬性

常用選擇器

id 選擇器 #hh  

類選擇器 .demo  

元素選擇器 div  

全選擇器 *   

後代選擇器 parent child  所有後代

子選擇器 parent>child  兒子代的 孫子代以後的就不行了

相鄰兄弟選擇器 pre+next  此元素之後的乙個兄弟元素  和jquery的.next()一樣

一般兄弟選擇器 prev~siblings  次元素之後的所有兄弟元素 jquery的.siblings() 更全可以選擇同一父元素下的所有兄弟元素

基本篩選選擇器

$(':first') 第乙個元素

$(':last')

$(':not()')

$(':eq(index)')  等於從零開始

$(':gt(index)')   大於

$(':lt(index)')   小於

$(':even')  偶

$(':odd') 奇

$(':header') 標題

$(':gt(index)')  正在執行動畫效果的

內容篩選選擇器

$(':contains(text)')

$(':parent')有內容的

$(':empty')沒有內容的              

$(':has(text)')至少包含

可見篩選選擇器

$(':visible') 可見     注意 只要站空間都算可見  visibility:hidden ;opacity:0;即使不顯示也佔空間算可見

$(':hidden')  隱藏   ①display:none  ②type="hidden"  ③高寬為0  ④祖先隱藏

屬性篩選選擇器

$('[attribute=value]')

$('[attribute|=value]') 等於value或以value-開頭

$('[attribute*=value]') 字串包含value

$('[attribute~=value]') 空格值中包含

$('[attribute^=value]') 以value開始

$('[attribute$=value]') 以value結束

$('[attribute!=value]') 不等於

$('[attribute]')有這個屬性

$('[attribute][attribute][attribute]')

子元素篩選器

$(':first-child') 第乙個子元素

$(':last-child')

$(':only-child') 唯一子元素

$(':nth-child') 第n個,從1開始  $(':nth-child(3n)') ,$(':nth-child(even)') 

$(':nth-last-child') 倒數第n個

注意:nth-child(index) 是從1開始,:eq(index)是從0開始

表單元素篩選器

$(':input') input textarea select button

$(':text') 

$(':password')

$(':radio')

$(':checkbox')

$(':submit')

$(':reset')

$(':button')

$(':image')

$(':file')

表單物件篩選器

$(':enable') 可用

$(':disenable')

$(':checked')

$(':selected') 注意選中的是option         

注意:①選擇器裡面有特殊符號例如 # 需要用\\進行轉義 $('#a\\#b');

②老版本屬性選擇器是帶@的,[@title='text'],這可能會因為更新jquery版本而報錯

③選擇器多乙個空格和少乙個空格的影響是很大的。

總結基本概念

1 web窗體頁 使用html頁模板設計的網頁,與伺服器進行互動時只能使用客戶端指令碼,但是當需要與xml sql server oracle資料庫或伺服器打交道時,基於指令碼的實現非常繁瑣,而如果在伺服器端實現,則既能充分利用.net提供的所有類庫,還能自動將伺服器端處理的結果傳送到客戶端。asp...

01 爬蟲的基本概念

爬蟲網路爬蟲 又被稱為網頁蜘蛛,網路機械人 就是模擬客戶端傳送網路請求,接收請求響應,一種按照一定的規則,自動地抓取網際網路資訊的程式.原則上,只要是瀏覽器能做的事情,爬蟲都能做.爬蟲能做什麼 爬蟲的分類 爬蟲獲取的資料的用途 進行資料分析或者是機器學習相關的專案 爬蟲的流程 通用搜尋引擎的侷限性 ...

01docker基本概念

官方文件url 2.docker的底層原理 linux容器 linux containers,lxc 技術 分層檔案系統構建和高效的映象機制 3 docker的好處 docker通過容器來打包應用 解耦應用和執行平台。這意味著遷移的時候,需要在新的伺服器上啟動需要的容器就可以了,無論新舊伺服器是否是...