Отслеживание ВСЕХ выбранных элементов с использованием JavaScript - PullRequest
9 голосов
/ 01 марта 2012

Я хочу отслеживать ВСЕ элементы, которые нажимаются на HTML-странице. Мне нужен хороший способ ссылаться точно на элемент, на который был нажат (поэтому я смогу воспроизвести клики на той же отдельной HTML-странице позже).

Есть ли хороший способ ссылаться на элемент, по которому щелкнули?

Я мог бы добавить уникальные идентификаторы и имена классов для каждого элемента на странице. Но я полагаю, что должен быть другой путь?

HTML-страница, на которой я буду воспроизводить клики, будет идентичной.

Что-то более легкое в этом (но более точная информация, с каким элементом это было, возможно, это можно собрать) ...

Код для отслеживания элемента, который был нажат

var arrayWithElements = new Array();

document.onclick = clickListener;

function clickListener(e) {
    var clickedElement;
    if(e == null) {
        clickedElement = event.srcElement;
    } else {
        clickedElement = e.target;
    }
    arrayWithElements.push(clickedElement)
    alert(arrayWithElements);
}

Код, который будет использоваться на идентичной HTML-странице

document.someHowGetTheElement().onclick();

Ответы [ 2 ]

16 голосов
/ 01 марта 2012

Полагаю, вы ищете что-то вроде этого:


var arrayWithElements = new Array();

function clickListener(e) 
{   
    var clickedElement=(window.event)
                        ? window.event.srcElement
                        : e.target,
        tags=document.getElementsByTagName(clickedElement.tagName);

    for(var i=0;i<tags.length;++i)
    {
      if(tags[i]==clickedElement)
      {
        arrayWithElements.push({tag:clickedElement.tagName,index:i}); 
        console.log(arrayWithElements);
      }    
    }
}

document.onclick = clickListener;

При каждом щелчке будет сохраняться объект, содержащий tagName элемента и индекс.Таким образом, вы можете получить доступ к этому элементу в другом «экземпляре» этого документа, используя

document.getElementsByTagName(item.tag)[item.index]

(где item - это элемент arrayWithElements)

Demo: http://jsfiddle.net/doktormolle/z2wds/

1 голос
/ 01 марта 2012

Вы можете использовать этот связанный вопрос .Другими словами, хороший способ узнать, по какому элементу щелкнули без добавления идентификаторов, - использовать метод jquery .cssSelectorAsString().Например:

function clickListener(e) {
    var clickedElement;
    if(e == null) {
        clickedElement = event.srcElement;
    } else {
        clickedElement = e.target;
    }
    arrayWithElements.push($(clickedElement).cssSelectorAsString()); // <====
    alert(arrayWithElements);
}    

См. Также: Получить уникальный селектор элемента в Jquery

...