Найти динамический добавленный тег с помощью JavaScript

Question

Я пытаюсь увидеть, как найти тег, который был динамически добавлен в таблицу, так:

ParentTag= document.getElementById('parentdiv');
var newTag = document.createElement('div');
newTag.innerHTML="<span class="ImNew"></span>" 
ParentTag.appendChild(newTag);

Как я смогу найти этот тег в javascript , не склоняясь к использованию jquery, поэтому никаких живых рекомендаций, пожалуйста .. Попытка найти этот новый тег в строго javascript.

Тег, на который я ссылаюсь, является тегом span

Answer 1

Вы можете дать вашему новому тегу идентификатор при создании:

ParentTag= document.getElementById('parentdiv');
var newTag = document.createElement('div');
newTag.setAttribute('id','myNewID');
newTag.innerHTML="<span class="ImNew"></span>" 
ParentTag.appendChild(newTag);

Затем, позже, просто используйте этот идентификатор:

var newTag = document.getElementById('myNewID');

Answer 2

Это зависит от того, какие другие элементы существуют в элементе. Например, вы можете получить все теги span в элементе и отфильтровать теги с определенным именем класса:

var parentTag = document.getElementById('parentdiv');
var spans = parentTag.getElementsByTagname('SPAN');
var filtered = [];
for (var i=0; i<spans.length; i++) {
  if (spans[i].className === 'ImNew') filtered.push(spans[i]);
}

Если в элементе есть только один тег span с этим именем класса, массив filtered теперь содержит ссылку на этот элемент.

Answer 3

Как уже упоминали другие, почему бы просто не отследить это или не дать ему id, если оно понадобится вам позже?

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

var parent = document.getElementById("parentdiv")
for (var i = parent.childNodes.length - 1; i >= 0; i--)
{
    var el = parent.childNodes[i];
    if (el.nodeType == 1 &&
        el.nodeName.toLowerCase() == "div" &&
        el.firstChild &&
        el.firstChild.nodeName.toLowerCase() == "span" &&
        el.firstChild.className = "ImNew")
    {
        // el.firstChild is what you want
    }
}