javascript - 从 div 获取 rel

Question

这里给出下面的HTML

 <div class="navBulletsWrapper">
<div rel="0" class=""></div>
<div rel="1" class=""></div>
<div rel="2" class=""></div>
<div rel="3" class=""></div>
<div rel="4" class="active"></div>
<div rel="5" class=""></div>
<div rel="6" class=""></div>
<div rel="7" class=""></div>
</div>

我想获得具有类活动的 div 的 rel 值

试过了

$('.navBulletsWrapper .active')[0].attr('rel')

但失败，因为 div 没有 attr

Answer 1

$('.navBulletsWrapper .active')[0]会给你一个DOM对象，而不是一个 jquery 对象；因此，它不会像attr附加任何 jquery 函数。

$('.navBulletsWrapper .active').eq(0).attr('rel')

应该管用。

如果您一次只有一个.activediv，则不必使用eq(0)

$('.navBulletsWrapper .active').attr('rel')

Answer 2

http://jsfiddle.net/4dTAG/

仅使用 javascript 的方法如下：

var divs = document.getElementsByClassName("navBulletsWrapper")[0].getElementsByTagName("div");
for (i = 0; i < divs.length; i++) {
    if(divs[i].className=="active"){
        var rel = divs[i].attributes.rel.value;
        alert(rel);
        break;
    }
}

使用您尝试过的方法的 jquery 方法 http://jsfiddle.net/4dTAG/1/

var rel = $('.navBulletsWrapper .active')[0].attributes.rel.value

Answer 3

你不需要 [0] 因为只有一个 .active

$('.navBulletsWrapper .active').attr('rel');

Answer 4

$('.navBulletsWrapper .active')[0]

是一个html元素。

$('.navBulletsWrapper .active').eq(0)

是一个具有该attr()功能的 jQuery 元素。

Answer 5

本国的： document.querySelector('.navBulletsWrapper .active').getAttribute('rel');

jQuery： $('.navBulletsWrapper .active').attr('rel');

Answer 6

rel根据文档，属性不能与 div 一起使用

https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel

最好使用data-id="1"类型属性