一个获取页面某元素在此页面上“唯一xpath”的jQuery插件。
使用python开发一个爬虫项目,一开始用的bs4,发现bs4中对同一级别的元素支持很差,无论xpath还是css选择器都不太好弄。 后来选择使用py lxml + xpath,毕竟这是最佳之选。可能是我寻找能力有问题,没有找到成熟的获取xpath的插件,或者找到的不太符合自己的需求。 比如Google chrome的F12、还有一个js插件(网络来源,已忘记出处),所以打算自己写一个,自己比较喜欢jQuery,就写了个简单的。
可使用任意属性获取(与元素高亮冲突)
指定id/class获取
id/class共存
对于有些不规范的源码中table不包含tbody元素 而页面自动添加tbody元素的兼容
自动获取元素在xpath规范下的index,比如
//body/div[id=”content”]/div[2]
获取xpath:getXpath 参数
var defaults = { keepTbodys: false, // 保留tbody与否 isHightLight: true, // 元素高亮 mode: “id&class” // any / id / class / id&class / // 模式 any为任意属,与元素高亮冲突 // 模式 id ,只元素自己或父元素有id且页面唯一才停止 // 模式 class ,只元素自己或父元素有class且页面唯一才停止 // 模式 id&class,可以是id_class等。。只要包含id/class就行,id和class只要唯一就停止搜索 };
获取元素的xpath index:getXpathIndex 无参
var path = $(selector).jQueryGetXpath("getXpath", { keepTbodys: true, mode: 'id_class', isHightLight: true });
为了防止点击链接跳转等事件,可以对a标签取消跳转、所有jquery的点击事件都可以进行屏蔽等操作
$(‘body ’).unbind(“click”);$(‘body ’).click(function (event) { var path = $(this).jQueryGetXpath(“getXpath”, { keepTbodys: false, mode: ‘id_class’, isHightLight: true }); alert(path);() + 20); event.stopPropagation(); // 阻止冒泡 return false;//阻断后续事件});
但是xpath是正确的-_6)使用js验证xpath正确性(可能会出现不一致,但是xpath是正确的)
var path = $(selector).jQueryGetXpath("getXpath", { keepTbodys: true, mode: "idclass"});var headings = document.evaluate(path, document, null, XPathResult.ANY_TYPE, null);var thisHeading = headings.iterateNext();var xpathText = "";while (thisHeading) { xpathText += thisHeading.textContent + "\n"; thisHeading = headings.iterateNext();}var jQueryText = $(selector).text();if (xpathText.trim() === jQueryText.trim()) { alert("校验通过:\n" + xpathText.trim());}else { alert("校验未通过:\n xpath:\n" + xpathText + "\n" + "jQuery:\n" + jQueryText);}