3

由于缺乏对 DOM 的理解，我不确定如何正确地提出这个问题。

我想要做的是捕捉任何给定 DOM 元素上的任何点击事件。然后我想保存元素类型以及对数据库中元素的完整引用。但我不确定这是否可能？

我想要实现的是保存与 Web 应用程序的漏洞交互，以便您以后可以在给定会话中重播在网站上执行的每个操作。

我尝试了不同的方法，例如获取单击元素的 X 和 Y 位置，然后触发对这些 xy 坐标的单击，但是这种方法存在一些问题。我还尝试向后遍历 Dom，直到我到达 body 标签，以构建一个 unike 选择器，但这也有它的缺点。我能想到的最好的解决方案是保存 $(this) 包含的内容。

4

2 回答 2

1

如果单击事件是您要跟踪的唯一事件，您可能希望将单击事件处理程序添加到页面上的每个可单击元素。

这将需要从 DOM 开始<body>并遍历 DOM，在进行时添加处理程序。

同时，我会data-xpath为每个包含 XPath 选择器的元素添加一个新属性，以便您可以在处理程序中使用它来记录被单击的元素，从而重播用户的交互。

有关 XPath 的介绍，请参见http://www.w3schools.com/xpath/xpath_intro.asp。

于 2013-08-05T17:34:39.193 回答
0

昨天睡着了，我有了一个想法，今天结束了这段代码。- 它按预期工作，但我猜 Xpath 会表现得更好！？

$(document).click(function(event) {
    var target = $(event.target);
    var parents = target.parents();
    var myParents = '';
    $($(parents).get().reverse()).each(function(key, value){
        var parentIndex = $(this).index()+1;
        myParents += $(this).prop("tagName")+':NTH-CHILD('+parentIndex+') > '; 
    });
    var childIndex = target.index()+1;
    var childTag = target.get(0).tagName;
    myParents += childTag+':NTH-CHILD('+childIndex+')';
    alert(myParents);
});

上面的代码将返回一个唯一的选择器字符串，如下所示：

HTML:NTH-CHILD(1) > BODY:NTH-CHILD(2) > SECTION:NTH-CHILD(1) > UL:NTH-CHILD(1) > LI:NTH-CHILD(3) > A:NTH-CHILD(1)
于 2013-08-06T13:48:01.697 回答