微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在Jquery中获取元素的唯一选择器

我想创建一个类似记录器,它跟踪用户的所有操作。为此,我需要标识用户与之交互的元素,以便我可以在以后的会话中引用这些元素。

在伪代码中,我想要能够做下面的事情

示例HTML(可能有任何复杂性):

<html>
<body>
  <div class="example">
    <p>foo</p>
    <span><a href="bar">bar</a></span>
  </div>
</body>
</html>

用户点击了某些内容,例如链接。现在我需要识别被点击的元素,并保存在DOM树中的位置以供将来使用:

(any element).onclick(function() {
  uniqueSelector = $(this).getUniqueSelector();
})

现在,uniqueSelector应该是类似的(我不介意,如果它是xpath或css选择器样式):

html > body > div.example > span > a

这将提供保存该选择器字符串并在稍后使用它以重放用户做出的动作的可能性。

这怎么可能?

更新

得到我的答案:Getting a jQuery selector for an element

解决方法

我会自己回答,因为我发现一个解决方案,我不得不修改。以下脚本正在工作,基于 script of Blixt
jQuery.fn.extend({
    getPath: function () {
        var path,node = this;
        while (node.length) {
            var realNode = node[0],name = realNode.localName;
            if (!name) break;
            name = name.toLowerCase();

            var parent = node.parent();

            var saMetagSiblings = parent.children(name);
            if (saMetagSiblings.length > 1) { 
                allSiblings = parent.children();
                var index = allSiblings.index(realNode) + 1;
                if (index > 1) {
                    name += ':nth-child(' + index + ')';
                }
            }

            path = name + (path ? '>' + path : '');
            node = parent;
        }

        return path;
    }
});

原文地址:https://www.jb51.cc/jquery/184681.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐