無(wú)痕埋點(diǎn)之XPath

mingzhong 發(fā)布于2019-08-20 15:52 / 1773人閱讀

摘要：在這里我們是用來(lái)標(biāo)識(shí)頁(yè)面元素控件的唯一性至于什么是，可以自行。有它算出的功能打開(kāi)一個(gè)網(wǎng)頁(yè)，，在彈出的小窗口中選中一個(gè)標(biāo)簽，右鍵，看到了吧點(diǎn)下然后粘貼下就知道這元素的標(biāo)簽的多少了瀏覽器中通過(guò)獲取和根據(jù)獲取元素

在這里我們是用XPath來(lái)標(biāo)識(shí)頁(yè)面元素、控件的唯一性

XPath

至于什么是XPath，可以自行g(shù)oogle。chrome有它算出XPath的功能！打開(kāi)一個(gè)網(wǎng)頁(yè)，F(xiàn)12，在彈出的小窗口中選中一個(gè)標(biāo)簽，右鍵，看到“copy XPath”了吧！點(diǎn)下然后粘貼下就知道這元素的標(biāo)簽的XPath多少了

Javascript get XPath and find element by XPath

Chrome瀏覽器中通過(guò)js獲取xpath和根據(jù)xpath獲取元素

export default {
    getXPath(elm){
        let allNodes = document.getElementsByTagName("*")
        for(var segs = []; elm && elm.nodeType == 1; elm = elm.parentNode){
            if(elm.hasAttribute("id")){
                let uniqueIdCount = 0
                for(var n=0;n < allNodes.length;n++){
                    if (allNodes[n].hasAttribute("id") && allNodes[n].id == elm.id) uniqueIdCount++;
                    if (uniqueIdCount > 1) break;
                }
                if(uniqueIdCount == 1){
                    segs.unshift("http://*[@id="" + elm.getAttribute("id") + ""]");
                    return segs.join("/");
                }else{
                    return false
                }
            }else{
                for(var i = 1, sib = elm.previousSibling; sib; sib = sib.previousSibling){
                    if (sib.localName == elm.localName)  i++;
                }
                if(i == 1){
                    if(elm.nextElementSibling){
                        if(elm.nextElementSibling.localName != elm.localName){
                            segs.unshift(elm.localName.toLowerCase())
                        }else{
                            segs.unshift(elm.localName.toLowerCase() + "[" + i + "]");
                        }
                    }else{
                        segs.unshift(elm.localName.toLowerCase())
                    }
                }else{
                    segs.unshift(elm.localName.toLowerCase() + "[" + i + "]");
                }
            }
        }
        return segs.length ? "/" + segs.join("/") : null
    },
    getElem(path){
        try{
            var evaluator = new XPathEvaluator();
            var result = evaluator.evaluate(path, document.documentElement, null,XPathResult.FIRST_ORDERED_NODE_TYPE, null);
            return  result.singleNodeValue || "";
        }catch(e){
            return ""
        }
    }
}