不可否認，jQuery是一款非常優秀的JavaScript庫，極大的提高了前端開發效率。
有利就有弊，過度的依賴jQuery可能會帶來代碼執行效率低等問題；隨著原生JavaScript版本的升級，現在很多內置的功能也能夠完美的實現jQuery的對應功能，下面就簡單做一下羅列，需要的朋友可以做一下參考。
一.元素查找:
（1）.通過id查找元素:
$("#ant")
jQuery的id選擇器完全可以使用原生方法替代:
document.getElementById("ant")
（2）.通過class屬性來查找元素:
$(".ant")
document.querySelector()和document.querySelectorAll()方法:
這兩個方法可以實現強大的選擇器功能，下面是幾個簡單代碼:
//獲取id屬性值為ant的元素對象
document.querySelector("#ant");
//獲取id屬性值為ant下面的所有div元素集合
document.querySelectorAll("#ant div");
二.判斷節點是否存在:
$("#ant").length > 0
上面的代碼可以使用下面的代碼替代:
document.getElementById("ant") !== null
三.節點遍歷:
("div").each(function (index, elem) {
//code
})
上面的代碼可以採用下面的代碼替代:
function forEach(elems, callback) {
if([].forEach) {
[].forEach.call(elems, callback);
} else {
for (var index = 0; index < elems.length; index++) {
callback(elems[index], index);
}
}
}
var div = document.querySelectorAll("div");
forEach(div, function(elem, index){
//code
});
十五年編程經驗，今年1月整理了一批2019年最新WEB前端教學視頻，不論是零基礎想要學習前端還是學完在工作想要提升自己，這些資料都會給你帶來幫助，從HTML到各種框架，幫助所有想要學好前端的同學，學習規劃、學習路線、學習資料、問題解答。只要關注我的頭條號，後臺私信我【前端】兩個字，即可免費獲取。
分享到:
閱讀更多 前端技術教學分享 的文章
關鍵字: 功能 JavaScript 內置
