摘要:是小巧輕量級(jí)的函數(shù)庫。本著寫得少,做的多的原則來替代原生代碼,選擇器為其核心內(nèi)容。一引入引入方法,注意引入要在代碼上。二使用原始書寫代碼簡寫如下兩種方式注意書寫盡量使用原始書寫方法,以提高代碼讀寫區(qū)分加載。
JQuery是小巧、輕量級(jí)的javascript函數(shù)庫。本著“寫得少,做的多”的原則來替代javascript原生代碼,選擇器為其核心內(nèi)容。
一、引入JQuery:
cdn引入方法,注意:JQuery引入要在JS代碼上。
二、使用JQuery
// jquery原始書寫 // $(document).ready(function(){ // }) //代碼簡寫如下兩種方式: // $().ready(function(){ // }) // $(function(){})
注意: jquery書寫盡量使用原始書寫方法,以提高代碼讀寫、區(qū)分window.onload加載。
三、選擇器:返回值為類似的數(shù)組的值,不會(huì)返回null和undefind;其返回值遵循其結(jié)構(gòu)
選擇器是jquery中最重要的部分,具體內(nèi)容如下:
1、基礎(chǔ)選擇器:
#id:id選擇器,不可重復(fù),執(zhí)行效率高 element:標(biāo)簽選擇器 class:類名選擇器 *:通配符選擇器 其中element和class選擇器可以多次重復(fù)使用,執(zhí)行效率沒有id選擇器高
2、多項(xiàng)選擇器:將每一個(gè)選擇器的元素合并到同一個(gè)數(shù)組中返回
3、層級(jí)選擇器:
("ancestor descendant")后代選擇器(祖先 后代) ("parent>child")子選擇器 只匹配一層 **執(zhí)行效率高,使用率高** ("prev+next")next選擇器/下一下選擇器,匹配所有與prev相臨的元素 ("prev~siblings")兄弟選擇器,同級(jí)關(guān)系
4、屬性選擇器
[attribute] 屬性名選擇器 [attribute=value]屬性值選擇器 [attribute!=value]非屬性選擇器 [attribute^=value]以某個(gè)屬性開頭 [attribute$=value]以某個(gè)屬性結(jié)尾 [attribute*=value]包含選擇器 [selector1][selector2][selectorN]多個(gè)屬性選擇器(條件同時(shí)滿足)
屬性選擇器 開發(fā)工具
Sublime
Westrom
Visual Studio
Visual Studio Code
開發(fā)語言
HTML
Css
JavaScript
JQuery
5、過濾選擇器分為child與type兩種類型,其中child側(cè)重節(jié)點(diǎn)的查找,而type側(cè)重于標(biāo)簽類型的查找,詳情見如下代碼:
child類型:
過濾選擇器 編輯器
Sumblime
IDE
WebStorm
Visual Studio
Visual Studio Code
開發(fā)語言
HTML
Css
JavaScript
jQuery
type類型:
過濾選擇器 編輯器
Sumblime
IDE
WebStorm
Visual Studio
Visual Studio Code
開發(fā)語言
HTML
Css
JavaScript
jQuery
注:其中過濾選擇器的參數(shù)可以為n(子元素序號(hào),從1開始)、even(偶數(shù))、odd(奇數(shù))、formula(特殊公式為an+b,必須為n,不可為其它字母)
------------------------------待續(xù)-----------------------------------------
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.hztianpu.com/yun/101495.html
摘要:文檔加載注在使用時(shí),可直接簡寫成,但是為了不發(fā)生歧義及造成不必要的錯(cuò)誤,最好是把寫上方式加載完畢加載完畢加載完畢加載完畢加載完畢與別名可互通加載完畢加載完畢加載完畢加載完畢動(dòng)態(tài)綁定元素寫法使用綁定動(dòng)態(tài)生成的元素時(shí),不能直接用該對(duì)象操作,而是 1.文檔加載 1.JS window.onload=function(){ document.getElementById(m...
摘要:目前在前端開發(fā)所占的比重越來越高,在我們學(xué)習(xí)和開發(fā)的過程中都會(huì)去使用。下面把程序員雷雪松對(duì)的知識(shí)點(diǎn)總結(jié)和歸納分享給大家。過濾對(duì)同胞元素的搜索。將匹配元素集合縮減為集合中的最后一個(gè)元素。返回指定元素相對(duì)于其他指定元素的位置。 jQuery目前在Web前端開發(fā)所占的比重越來越高,在我們jQuery學(xué)習(xí)和開發(fā)的過程中都會(huì)去使用。jQuery幫我們解決了瀏覽器之間JS一些不兼容的地方和簡化了原...
摘要:前端知識(shí)點(diǎn)總結(jié)什么是第三方的極簡化的操作的函數(shù)庫第三方下載極簡化是操作的終極簡化個(gè)方面增刪改查事件綁定動(dòng)畫效果操作學(xué)習(xí)還是在學(xué),只不過簡化了函數(shù)庫中都是函數(shù),用函數(shù)來解決一切問題為什么使用操作的終極簡化解決了大部分瀏覽器兼容性問題凡是讓用的 前端知識(shí)點(diǎn)總結(jié)——JQ 1.什么是jQuery: jQuery: 第三方的極簡化的DOM操作的函數(shù)庫 第三方: 下載 極簡化: 是DOM操作的...
摘要:課堂筆記開發(fā)歷史時(shí)代靜態(tài)頁面用戶交互較少功能偏弱,沒有真正意義上的前端開發(fā)時(shí)代面向編程改變了數(shù)以百萬計(jì)的前端開發(fā)程序員寫代碼的方式做了事件化這件事情也是從開始的的擴(kuò)展性非常好,以為中心的生態(tài)非常好,基于的庫非常多沒有模塊加載機(jī)制,需要顯示地 課堂筆記 web開發(fā)歷史 web1.0時(shí)代 靜態(tài)頁面; 用戶交互較少; 功能偏弱,沒有真正意義上的前端開發(fā); jQuery時(shí)代 面向DOM編...
摘要:目前接觸最多的頁面開發(fā),基本還是使用的。主要原因基于操作方便頁面簡單兼容良好新手多沒有能配合使用其他方案的人。,是的核心理念。 目前接觸最多的頁面開發(fā),基本還是使用 JQuery 的。主要原因基于:操作方便;頁面簡單;兼容良好;新手多……沒有能配合使用其他方案的人。因此,本篇文章就是寫著玩加吐點(diǎn)槽的。 Write Less,Do More是JQuery的核心理念。所以你們就不要在工作中...
閱讀 990·2019-08-30 15:54
閱讀 1539·2019-08-30 15:54
閱讀 2460·2019-08-29 16:25
閱讀 1362·2019-08-29 15:24
閱讀 824·2019-08-29 12:11
閱讀 2569·2019-08-26 10:43
閱讀 1306·2019-08-26 10:40
閱讀 532·2019-08-23 16:24