Question

我有3个具有3个div的锚点锚点是这样的：

<a class="home sharedClass">home</a>

<a class="about sharedClass">about</a>

<a class="contact sharedClass">contact</a>

当我点击其中一个时，我得到相应div的内容，其id与第一个类（home，about或contact）相同

我有一个小jQuery代码，必须选择正确的类但结果是一个警告告诉theClass的名称：

$('a.sharedClass').click(function(){

    var theClass = $(this).attr('class[0]');

    alert(theClass)

});

问题是此函数返回“undefined”。如何解决这个问题？

感谢。

Answer 1

首先获取class属性。

var theClass= $(this).attr('class');

你必须打破（爆炸/分裂）

var split = theClass.split(' '); // this returns an array

最后你可以访问第一堂课

var firstClass = split[0];

Answer 2

那是因为属性class只是一个字符串。获得它后，您将获得该字符串值中的所有类。如果要获取项目，可以将其分解为数组，然后访问项目0。

theClass = $(this).attr('class').split(' ', 1)[0];

在更现代的浏览器中（实际上是关于所有相关的浏览器），您可以使用元素的classList property来获取类的列表并添加到它中。不过，我不确定是否会按特定顺序返回类。我认为在实施中它更像是一个'包'而不是'列表'，因为你可以检查一个类是否在其中，但是不能获取或修改第一个项目。

最后，这是最安全的使用类的方法。毕竟，你想要检查一个元素是否有一个类，而不是它本身就是第一个类。

Answer 3

class属性不是数组。它是一个字符串，所有属性都是如此。此外，attr函数将在名为class[0]的元素上查找它将找不到的属性。

$('a.sharedClass').click(function(){
  var theClass = $(this).attr('class'),
      firstClass = (theClass || '').split(' ')[0]; // handle if no class attribute
    alert(firstClass);
});

Answer 4

为什么不只是获取文本然后你甚至不需要类

$('a.sharedClass').click(function(){

    alert(this.text)

});

jquery或js选择元素的第一个类

4 个答案: