jquery部分筆記上傳
阿新 • • 發佈:2018-12-20
jquery:封裝後的js
jquery兩大特色:
1.隱式迭代
2.鏈式呼叫
1.引入jquery庫
1.jquery的入口函式不覆蓋 (而js的DOM物件的入口函式window.onload=function(ev){}會覆蓋,只能有一個)
$(document).ready(function()){}; 獲取document文件樹,繫結jquery的ready方法。繫結後可回撥文件樹中的函式
可簡寫為:
$(function(){});
- js->jquery div==>$(div) $(js)
jquery->js div[0]; js[0]
3.獲取元素方法
$(‘obj1,obj2’) 可返回多個元素,逗號隔開
4.$js.css(‘color’,‘red’); 給jquery物件新增樣式的方法,obj.css(’’,’’)當樣式不止一個時obj.css({’’:’’,’’:’’})
5.隱式迭代、鏈式呼叫
$obj.html(‘文字內容’).css(‘color’,‘red’)
6.點選事件obj.click()
7.移入事件obj.mouseenter(function(){})
$('li:odd').mouseenter(function() { li的奇數下標也就是偶數行 $(this).css({"background-color":"red","font-size":"30px"}); }) $('li:even').mouseenter(function() { li的偶數下標也就是奇數行 $(this).css({"background-color":"yellow","font-size":"30px"}); })
8.獲取或修改屬性:$(‘img’).attr(‘src’); 獲取src屬性,不可獲取單值屬性,可用prop()
$(‘img’).attr(‘alt’,‘錯錯錯’); 設定alt屬性
9.移除屬性:
$(‘img’).removeAttr(‘index’); 只能刪除自定義屬性
$(‘img’).removeClassr(‘index’); 可刪除樣式屬性99
1.attr/prop:獲取屬性、設定屬性 移除屬性
$('img').attr('src'); 獲取圖片的src屬性
$('input').prop('checked'); 獲取單值屬性要用prop(),check是預設值false不選中,true選中
$('img').attr/prop('alt','錯錯錯') 設定圖片的屬性alt
$('img').removeAttr('index') 移除圖片下標屬性