-4

好的。我想在主 div 中获取 div 的所有类名。

如何做到这一点才能在 div 中获取所有 div 类？

例如：

<div id="themaindiv">
    <div class="div1"></div>
    <div class="div2"></div>
    <div class="div3"></div>
</div>

现在，我想获取名为“themaindiv”的 div 内的所有 div 的所有类名，但我只是不知道该怎么做。

更新：然后将那些被函数挂钩的类名显示到指定的div（'#theclassnames'）中。

应该是结果的例子。

<div id="theclassnames">div1 div2 div3 div4</div>

提前致谢。

4

6 回答 6

4

假设您的意思是要获取每个的类名的数组，div它是 的后代#themaindiv，您可以使用map来获取每个元素的类名，并get获取一个数组：

var arrayOfClassNames = $("#themaindiv div").map(function() {
    return this.className;
}).get();

这是一个工作示例。

一些注意事项：

  • 使用普通的 CSS 选择器#themaindiv div比使用find其他一些答案中的方法更快。

  • 使用 nativeclassName属性比传递this给 jQuery 并使用attrorprop方法更快。

  • 如果您不关心最终得到的是 jQuery 实例而不是本机 Array，则可以省略对get.

更新

显然，您现在想在另一个div. 最简单的方法是简单地使用该text方法并传入数组：

$("#theclassnames").text(arrayOfClassNames);

这会将 的文本内容设置#theclassnames为该数组的字符串表示形式。在您的情况下，这将是“div1，div2，div3”。您可以在这里看到它的实际效果。

要完全按照您现在在问题中显示的方式显示它，您可以简单地join使用带有空格的数组：

$("#theclassnames").text(arrayOfClassNames.join(" ");

这是另一个工作示例。

于 2012-06-12T10:46:55.223 回答
0 
$("#themaindiv div").each(function(){
    alert($(this).attr("class"));
});
于 2012-06-12T10:47:18.203 回答
0

怎么样：

$('#themaindiv div').each(function(){
    console.log($(this).attr('class'));
})
于 2012-06-12T10:47:26.550 回答
0 
var classes = [];

$('#themaindiv').find('div').each(function(){
    classes.push(this.className);
});

要显示它们，您可以添加另一个 div ：

   <div id=theclassnames></div>

并做类似的事情

$('#theclassnames').html(classes.join(' '));

但是大多数 js 编码员会简单地做console.log(classes);

于 2012-06-12T10:47:43.380 回答
0

演示 http://jsfiddle.net/Fb3bN/11/

代码

$('#themaindiv').find('div').each(function(){
    alert($(this).prop('class'));
});​
于 2012-06-12T10:47:58.313 回答
0 
var arrayOfClassNames = [];
$("#themaindiv div").attr('class', function() {
  arrayOfClassNames.push(this.className);
});
console.log(arrayOfClassNames);

演示

于 2012-06-12T10:54:19.870 回答