javascript - hasclass - jQuery contando elementos por clase; ¿Cuál es la mejor manera de implementar esto?
jquery parent (5)
Lo que estoy tratando de hacer es contar todos los elementos de la página actual con la misma clase y luego los usaré para agregarlos a un nombre para un formulario de entrada. Básicamente, les estoy permitiendo a los usuarios hacer clic en un <span>
y luego, al hacerlo, agregar otro para más del mismo tipo de elementos. Pero no puedo pensar en una forma de contar todo esto simplemente con jQuery / JavaScript.
Iba a nombrar el elemento como algo así como name="whatever(total+1)"
, si alguien tiene una forma sencilla de hacerlo, le estaría sumamente agradecido, ya que JavaScript no es exactamente mi lengua materna.
Debería ser algo como:
// Gets the number of elements with class yourClass
var numItems = $(''.yourclass'').length
Como nota al margen, a menudo es beneficioso verificar la propiedad de longitud antes de encadenar muchas funciones en un objeto jQuery, para asegurarnos de que realmente tenemos algo de trabajo que realizar. Vea abajo:
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'');
});
}
HTML:
<div>
<img src='''' class=''class'' />
<img src='''' class=''class'' />
<img src='''' class=''class'' />
</div>
JavaScript:
var numItems = $(''.class'').length;
alert(numItems);
Obtener un recuento del número de elementos que se refieren a la misma clase es tan simple como esto
<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>
para contar:
$(''.yourClass'').length;
debería funcionar bien
almacenar en una variable es tan fácil como:
var count = $(''.yourClass'').length;
var count = $(''.'' + myclassname).length;