jQuery

1、document.querySlector() 選擇單個,
2、document.querySlectorAll() 選擇多個,
jQuery是目前使用最廣泛的javascript函數(shù)庫。
jQuery的版本分為1.x系列和2.x、3.x系列,1.x系列兼容低版本的瀏覽器,2.x、3.x系列放棄支持低版本瀏覽器,目前使用最多的是1.x系列的。
jquery是一個函數(shù)庫,一個js文件,頁面用script標簽引入這個js文件就可以使用。
引入一個外部js 代碼 《script type="text/javascript" src="js/jquery-1.12.2.js"></script》
jquery的口號和愿望 Write Less, Do More(寫得少,做得多)
jquery選擇器
(document) //選擇整個文檔對象('li') //選擇所有的li元素
('#myId') //選擇id為myId的網(wǎng)頁元素('.myClass') // 選擇class為myClass的元素
('input[name=first]') // 選擇name屬性等于first的input元素('#ul1 li span') //選擇id為為ul1元素下的所有l(wèi)i下的span元素
對選擇集進行修飾過濾(類似CSS偽類)
('#ul1 li:first') //選擇id為ul1元素下的第一個li('#ul1 li:odd') //選擇id為ul1元素下的li的奇數(shù)行
('#ul1 li:eq(2)') //選擇id為ul1元素下的第3個li('#ul1 li:gt(2)') // 選擇id為ul1元素下的前三個之后的li
('#myForm :input') // 選擇表單中的input元素('div:visible') //選擇可見的div元素
對選擇集進行函數(shù)過濾
('div').has('p'); // 選擇包含p元素的div元素('div').not('.myClass'); //選擇class不等于myClass的div元素
('div').filter('.myClass'); //選擇class等于myClass的div元素('div').first(); //選擇第1個div元素
('div').eq(5); //選擇第6個div元素 選擇集轉(zhuǎn)移('div').prev('p'); //選擇div元素前面的第一個p元素
('div').next('p'); //選擇div元素后面的第一個p元素('div').closest('form'); //選擇離div最近的那個form父元素
('div').parent(); //選擇div的父元素('div').children(); //選擇div的所有子元素
('div').siblings(); //選擇div的同級元素('div').find('.myClass'); //選擇div內(nèi)的class等于myClass的元素
jquery樣式操作
("#div1").addClass("divClass2") //為id為div1的對象追加樣式divClass2("#div1").removeClass("divClass") //移除id為div1的對象的class名為divClass的樣式
("#div1").removeClass("divClass divClass2") //移除多個樣式("#div1").toggleClass("anotherClass") //重復切換anotherClass樣式
click 點擊事件;
重復切換 (添加 / 刪除 style 樣式 )
重復切換:toggleClass
jquery屬性操作
1、html() 取出或設置html內(nèi)容
2、text() 取出或設置text內(nèi)容
3、attr() 取出或設置某個屬性的值
jquery特殊效果
fadeIn() 淡入
fadeOut() 淡出
fadeToggle() 切換淡入淡出
hide() 隱藏元素
show() 顯示元素
toggle() 依次展示或隱藏某個元素
slideDown() 向下展開
slideUp() 向上卷起
slideToggle() 依次展開或卷起某個元素
引入一個外部js 《script type = "tex/javascript" src = "js/javascript--路徑.js"》《/script》
innerhtml -- 元素里面包含的內(nèi)容;
樣式用css;用,逗號隔開;
綁定click事件
例如:('#btn1').click(function(){ // 內(nèi)部的this指的是原生對象 // 使用jquery對象用(this)
})
多選框默認勾選《input type = "checkbox" id = "check" checked = "checked"》多選
prop 和 attr 的區(qū)別?
prop 專門讀取 true 和 False 的屬性值;
attr 是讀取其他的 除了true 和 false 的屬性值;
面試題 : ready 和 onload 的區(qū)別?
答:jquery 里面的節(jié)點(標簽)執(zhí)行好了。。。。
window.onload 頁面渲染都執(zhí)行完后在執(zhí)行window.onload.
ready 比 window.onload 加載的快;

作者:一夢千年豪行天下
鏈接:http://www.itdecent.cn/p/fc22fa911095
來源:簡書
簡書著作權(quán)歸作者所有,任何形式的轉(zhuǎn)載都請聯(lián)系作者獲得授權(quán)并注明出處。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容