我要做的是用相同的类计算当前页面中的所有元素,然后我将使用它添加到输入表单的名称上。基本上,我允许用户单击<span>,然后通过这样做,为更多相同类型的项目添加另一个。但是我想不出一个简单的方法来计算所有这些简单的jQuery/JavaScript。
我将然后命名项目为像name="whatever(total+1)",如果有人有一个简单的方法来做到这一点,我将非常感激,因为JavaScript不是我的母语。
我要做的是用相同的类计算当前页面中的所有元素,然后我将使用它添加到输入表单的名称上。基本上,我允许用户单击<span>,然后通过这样做,为更多相同类型的项目添加另一个。但是我想不出一个简单的方法来计算所有这些简单的jQuery/JavaScript。
我将然后命名项目为像name="whatever(total+1)",如果有人有一个简单的方法来做到这一点,我将非常感激,因为JavaScript不是我的母语。
当前回答
获取引用同一类的元素数量的计数非常简单
<html>
<head>
<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert( $(".red").length );
});
</script>
</head>
<body>
<p class="red">Test</p>
<p class="red">Test</p>
<p class="red anotherclass">Test</p>
<p class="red">Test</p>
<p class="red">Test</p>
<p class="red anotherclass">Test</p>
</body>
</html>
其他回答
应该是这样的:
// Gets the number of elements with class yourClass
var numItems = $('.yourclass').length
作为旁注,在链接jQuery对象上的许多函数调用之前检查length属性通常是有益的,以确保我们确实有一些工作要执行。见下文:
var $items = $('.myclass');
// Ensure we have at least one element in $items before setting up animations
// and other resource intensive tasks.
if($items.length)
{
$items.animate(/* */)
// It might also be appropriate to check that we have 2 or more
// elements returned by the filter-call before animating this subset of
// items.
.filter(':odd')
.animate(/* */)
.end()
.promise()
.then(function () {
$items.addClass('all-done');
});
}
var count = $('.' + myclassname).length;
try
document.getElementsByClassName('myclass').length
let num = document.getElementsByClassName('myclass').length; console.log('Total "myclass" elements: '+num); .myclass{颜色:红色} <span class="myclass" >1</span> < span > 2 > < /跨度 < span class = " myclass”> 3 < / span > < span class = " myclass”> 4 > < /跨度
计算:
$ (' .yourClass ') . length;
应该没问题。
在变量中存储就像这样简单:
var count = $('.yourClass').length;
获取引用同一类的元素数量的计数非常简单
<html>
<head>
<script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert( $(".red").length );
});
</script>
</head>
<body>
<p class="red">Test</p>
<p class="red">Test</p>
<p class="red anotherclass">Test</p>
<p class="red">Test</p>
<p class="red">Test</p>
<p class="red anotherclass">Test</p>
</body>
</html>