Tengo un elemento con varias clases y me gustaría obtener sus clases de CSS en una matriz. ¿Cómo haría esto? Algo como esto:¿Cómo obtener todas las clases CSS de un elemento?
var classList = $(this).allTheClasses();
Tengo un elemento con varias clases y me gustaría obtener sus clases de CSS en una matriz. ¿Cómo haría esto? Algo como esto:¿Cómo obtener todas las clases CSS de un elemento?
var classList = $(this).allTheClasses();
No hay necesidad de usar jQuery para ello:
var classList = this.className.split(' ')
Si por alguna razón desea hacerlo desde un objeto jQuery, esas dos soluciones de trabajo, también:
var classList = $(this)[0].className.split(' ')
var classList = $(this).prop('className').split(' ')
por supuesto podría cambiar al modo de desarrollo excesivo y escribir un plugin de jQuery para ello:
$.fn.allTheClasses = function() {
return this[0].className.split(' ');
}
Luego, $(this).allTheClasses()
le daría una matriz con los nombres de las clases.
bien, la razón por la que creo que necesito hacer esto en jquery es que estoy pasando un objeto jquery como parámetro de una función y usando el código de esta manera: var classList = TheObject.prop ('className'). Split (''); Funciona; ¿Es esta la mejor manera de hacerlo? – frenchie
Sí, esa es la mejor manera. Sin embargo, el complemento sería más agradable si lo usa en varios lugares de su código. – ThiefMaster
bien, gracias por el código. Volveré a la idea del complemento si necesito usar esto en varios lugares. – frenchie
Esto debería hacer el trabajo por usted:
var classes = $('div').attr('class').split(" ");
Esta sería la solución jQuery para otras soluciones hay otras respuestas!
mira esto:
var classes = $('selector').prop('classList');
Tenga en cuenta que también se puede utilizar myElement.classList
como una matriz simple. This is supported by all major browsers for a while now, apart IE 9 and below.
En realidad classList no es una matriz sino una [lista de tokens Dom] (https://developer.mozilla.org/en-US/docs/Web/API/DOMTokenList) así que tenga en cuenta que no puede usar métodos de matriz con ella inmediatamente. – Esko
function showClasses() {
const div = document.querySelector('div');
const classes = div.className.split(' ');
const p = document.querySelector('p');
p.innerHTML = classes;
}
<div class="foo bar">This div has foo, bar classes</div>
<p class='output'>Above div classes appear here</p>
<button onClick="showClasses();">Show div classes</button>
HTML
<div class="foo bar">This div has foo, bar classes</div>
vainilla JavaScript. Devolverá una matriz de clases.
const div = document.querySelector('div');
const classes = div.className.split(" "); // ['foo', 'bar']
posible duplicado de [obtener la lista de clase de elemento con jQuery] (http://stackoverflow.com/questions/1227286/get-class-list-for-element-with-jquery) –
duplicados son los resultados de diferentes consultas de búsqueda. Algunas personas buscarán en Google "Obtener lista de clases para el elemento" y otras buscarán "obtener las clases CSS de un elemento". Hice lo último, y otros también lo harán. – frenchie