成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

jquery等價dom操作

Mike617 / 1677人閱讀

摘要：介紹等價于原生操作。這里的可以使用的函數(shù)來做查找某個節(jié)點的所有兄弟節(jié)點，并返回數(shù)組列表前面的兄弟節(jié)點后面的兄弟節(jié)點查詢子節(jié)點中的某個標簽

介紹 jquery 等價于 dom 原生操作。

empty() 
$("#id").empty()
var el = document.getElementById("app");
var child, nextChild;
for(child = el.firstChild; child; ) {
    nextChild = child.nextSibling;
    el.removeChild(child);
    child = nextChild;
}
append() 
$("#id").append()

這里的 append 可以使用 react 的 render 函數(shù)來做

render(
    
Hello wolrd
,
    document.getElementById("app")
)
css() 
$(".tdxmask").css({ display: "none" });
var els = document.getElementsByClassName("tdxmask");
els.forEach(function(el) {
    el.style.display = "none";
})
extend() 
$.extend({}, item.hot.style, {"background-image": "none" })
style = Object.assign({}, item.hot.style, {"background-image": "none" });
sibings(), find(), removeClass() 
$el.siblings().find("span").removeClass("sortup").removeClass("sortdown")
// 查找某個節(jié)點的所有兄弟節(jié)點，并返回數(shù)組列表
function siblings(el) {
    var s = [];
    var preEl, nextEl;
    preEl = el.previousSibling;
    nextEl = el.nextSibling;

    // 前面的兄弟節(jié)點
    while (preEl) {
        s.push(preEl);
        preEl = preEl.previousSibling;
    }

    // 后面的兄弟節(jié)點
    while (nextEl) {
        s.push(nextEl);
        nextEl = nextEl.nextSibling;
    }

    return s;
}

// 查詢子節(jié)點中的某個標簽
function findChildNodesByTagName(el, tagName) {
    var s = [];
    var childNodeList = el.childNodes;

    for(var i = 0; i < childNodeList.length; i++) {
        var cnode = childNodeList[i];
        if(cnode.nodeName.toUpperCase() == tagName.toUpperCase()) {
            s.push(cnode);
        }
    }

    return s;
}

let sibs = siblings(el);
sibs.map( sib => {
    findChildNodesByTagName(sib, "span").map( node => {
        // debugger;
        node.className = "";
    })
} )

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://hztianpu.com/yun/86295.html

相關(guān)文章

  • jQuery入門筆記之（一）選擇器引擎

    摘要：選擇器，若未作特別說明，獲取的都是元素集合。過濾器名語法說明選取所有不可見元素選取所有可見元素注意過濾器一般是包含的內(nèi)容為樣式為表單類型為和的元素。四子元素過濾器子元素過濾器的過濾規(guī)則是通過父元素和子元素的關(guān)系來獲取相應(yīng)的元素。 轉(zhuǎn)自個人博客本來是單獨整理了一個CSS選擇器的，但是在jQuery中基本都有對應(yīng)的，所以就不發(fā)了。 jQuery選擇器，若未作特別說明，獲取的都是元素集合。...

    charles_paul 評論0 收藏0

  • jQuery（一）-- 初步了解

    摘要：一初步了解介紹由創(chuàng)建于年一月的開源項目，憑借著跨平臺的兼容性，簡潔的語法，極大的簡化了人員遍歷文檔，操作，處理事件，執(zhí)行動畫，和開發(fā)的操作。只建立一個名為的對象。對發(fā)生在同一個對象上的一組動作，可以直接連寫無需重復(fù)獲取對象。 jQuery（一）-- 初步了解 jQuery介紹 由John Resig創(chuàng)建于2006年一月的開源項目，jQuery憑借著跨平臺的兼容性，簡潔的語法，極大的簡...

    quietin 評論0 收藏0

  • 前端培訓(xùn)-中級階段（5）- jQuery的概念與基本使用（2019-07-11期）

    摘要：前端最基礎(chǔ)的就是。前面我們已經(jīng)基本掌握常規(guī)的語法語義，以及基本的使用方法。等價于當載入就緒執(zhí)行一個函數(shù)回調(diào)。返回一組匹配的元素。據(jù)提供的原始標記字符串，動態(tài)創(chuàng)建由對象包裝的元素。同時設(shè)置一系列的屬性事件等。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門技術(shù)就算入門，但也僅僅是入門，現(xiàn)在前端開發(fā)的定義已經(jīng)遠遠不止這些。前端小課堂（HTML/CSS/JS），本著提...

    church 評論0 收藏0

  • 前端培訓(xùn)-中級階段（5）- jQuery的概念與基本使用（2019-07-11期）

    摘要：前端最基礎(chǔ)的就是。前面我們已經(jīng)基本掌握常規(guī)的語法語義，以及基本的使用方法。等價于當載入就緒執(zhí)行一個函數(shù)回調(diào)。返回一組匹配的元素。據(jù)提供的原始標記字符串，動態(tài)創(chuàng)建由對象包裝的元素。同時設(shè)置一系列的屬性事件等。 前端最基礎(chǔ)的就是 HTML+CSS+Javascript。掌握了這三門技術(shù)就算入門，但也僅僅是入門，現(xiàn)在前端開發(fā)的定義已經(jīng)遠遠不止這些。前端小課堂（HTML/CSS/JS），本著提...

    HmyBmny 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<