核心:操作dom(通過物件導向)
1.jq是一種鏈式操作 。
$可以拿到dom元素$(document).ready(
function
() )
//等同於
$(function() )
$(document).ready(function
() )
//等同
$(document).ready(function() )
原理:function
$(id)
$(id)
一種炫酷效果 下拉
$(document).ready(function() )
$(document).ready(function() )
一種效果 漸隱漸顯
$(document).ready(function() )
//等同
$(document).ready(function
() )
$('div').css()
$('div').on('click', () =>) //盡量不用箭頭函式 箭頭函式會影響this指向問題
$('p').on('mouseenter', () =>)
$('p').on('mouseenter', () =>)//$(can use element choies)
下面是獲得自定義屬性 data-name
用於實現 2. dry (dont repeat youself)
//原聲獲取屬性 .getattribute("屬性")
//jquery
獲取屬性 .attr("屬性")
$('.button').on('click', function(e) )
然後獲取元素身上自定義屬性
$('.button').on('click', function(e) )
乙個獨立標籤a內部四個標籤 要控制另外乙個標籤b內部對應的四個
a標籤內部設定自定義屬性內容等於b標籤id
點選a拿到自定義屬性 操控id
上面沒有真實操作dom,而是dom結構基礎上增加 刪除css樣式
dom操作是 增刪改查
1.獲取元素(節點關係)
$('p').first() 獲取相同元素的第乙個$('p').next() 當前元素的下乙個元素
$('p').prev() 當前元素上乙個
$('p').last() 獲取相同元素的最後乙個
$('p').eq(0) 獲取相同元素的指定下標那乙個
$('p').parent() 獲取元素的父節點
$('li').eq(1).siblings() 獲取元素兄弟元素
$('p').find('name') find() 方法返回被選元素的後代元素
$("p").filter(".intro") // 返回帶有類名 "intro" 的所有 元素 filter() 方法返回符合一定條件的元素
//filter()查詢的是某個元素的自身,而不是內部的元素
2.dom操作
//刪除元素
$('name').remove() 刪除這個節點//冒泡
$(function
() )
})//阻止冒泡 完美解決
$(function
() )
})
//刪除class
$(this).removeclass('u2-l1') //本身是class 不用加 .
//案例
$(function
() )
})
原始dom使用刪除class
let self =event.targetself.classlist.add('active')
remove(class1, class2, ...)
//toggle(class,
true|false
)contains(class)
//增加clss
$(this).addclass('u2-l1')//案例
$(function
() )
})
//玄技(玄中元素被特殊標記)
$(function() )
})
點選是否有某種樣式
$(function()
else
if ($(this).not('.u2-l1'))
})})
//相同效果
$(function
()
else
})})
// 判斷元素
$(function()})
jquery常用基本知識
一 基礎選擇器的使用 divid 選擇id未divid的元素 a 選擇所有元素 bgred 選擇所用css類未bgred的元素 選擇頁面所用元素 divid,a,bgred 同時匹配多個 二 層次選擇器 bgred div 選擇css類為bgred的元素中的所有 mylist li 選擇css類為m...
Jquery 基本知識 一
1.dom物件 通過例如getelementbyid方法獲取到dom樹中的元素就是dom物件 jquery物件 通過jquery包裝dom物件後產生的物件 注意 jquery物件和dom物件不能使用對方的任何方法 2.dom物件和jquery物件之間的轉化 jquery物件轉成dom物件有兩種方法 ...
Jquery 基本知識 一
1.dom物件 通過例如getelementbyid方法獲取到dom樹中的元素就是dom物件 jquery物件 通過jquery包裝dom物件後產生的物件 注意 jquery物件和dom物件不能使用對方的任何方法 2.dom物件和jquery物件之間的轉化 jquery物件轉成dom物件有兩種方法 ...