Question

找出第n个位置tagName，不要使用id和classname。是否可以获得第n个标记名值。

<!DOCTYPE html>
<html>
<body>

<div style="position:relative;border:1px solid;width:40px;height:40px;"></div>
<div style="position:relative;border:1px solid;width:40px;height:40px;"></div>
<div style="position:relative;border:1px solid;width:40px;height:40px;"></div>
<div style="position:relative;border:1px solid;width:40px;height:40px;"></div>
<div style="position:relative;border:1px solid;width:40px;height:40px;"></div>
<div style="position:relative;border:1px solid;width:40px;height:40px;"></div>

<script>

document.onclick = runfun;

function runfun(e)
{
    alert(e.target.tagName[]); // find out nth position tagName
}

</script>

</body>
</html>

Answer 1

我认为应该这样做：

function runfun(e) {
    var allDivs = document.getElementsByTagName('div');
    for (i = 0; i < allDivs.length; i++) {
        if (e.target == allDivs[i]) {
            alert(i);
            break;
        }
    }
}

DEMO

Answer 2

您的代码中的事件处理程序具有特定的事件目标，并且是单击的元素。它是一个DOM对象，您可以获取其标记名称。如果要在第n次迭代中循环遍历正文的所有子元素，则将获得第n个元素，并且可以访问其标记名称。

Answer 3

遍历所有标签并找到匹配项：

function check(e) {
    var tagName = e.target.tagName.toLowerCase(),
        allTags = document.getElementsByTagName(tagName);
    ([].slice.call(allTags)).forEach(function(el, i) {
        if (el === e.target) {
            alert(i);   
        }    
    });
}

document.addEventListener('click', check);

JSFiddle演示：

<强> http://jsfiddle.net/fmg44rvs/3/

如何在javascript中找到第n个位置tagName

3 个答案: