document.querySelectorToda la longitud es siempre 0

Estoy tratando de crear algunos cuadros que se puedan arrastrar en javascript. Decidí hacer una clase vacía "arrastrable" en CSS y una clase "box". El código es el siguiente:document.querySelectorToda la longitud es siempre 0

<!DOCTYPE html> 
<html> 

<head> 
    <style> 
    .draggable 
    { 

    } 
    .box 
    { 
     position: absolute; 
     width: 80px; height: 60px; 
     padding-top: 10px; 
     text-align: center; 
     font-size: 40px; 
     background-color: #222; 
     color: #CCC; 
    } 
    </style> 
</head> 

<body> 
<div class="draggable box">1</div> 
<div class="draggable box">2</div> 
<div class="draggable box">3</div> 
<script> 
    var draggableStuff = document.querySelectorAll('draggable'); 
    var tabLength = draggableStuff.length; 
    alert(tabLength); 
</script> 
</body>

El problema es que tabLength es siempre cero. Quiero obtener una matriz llena de todas las cosas arrastrables. Soy nuevo en javascript. ¿Qué me he perdido aquí?

Fuente

2012-03-06 Michael

desea seleccionar los elementos de la clase, por lo que no se olvide de que el punto:

var draggableStuff = document.querySelectorAll('.draggable');

Otra opción es utilizar document.getElementsByClassName:

var draggableStuff = document.getElementsBYClassName('draggable');

Fuente

2012-03-06 21:15:55

Gracias mucho! ¡Funciona! – Michael

@Michael Np. Consejo para la próxima vez, antes de preguntar por qué algo no funciona, asegúrese de haber leído la documentación correcta. Para JavaScript/CSS/HTML, Mozilla Developer Network es generalmente bueno. Agregue 'mdn' a su consulta de búsqueda, ej. ['querySelectorAll mdn'] (http://www.google.com/search?q=mdn+querySelectorAll), y a menudo obtiene los documentos correctos de inmediato: https://developer.mozilla.org/En/DOM/Document .querySelectorAll –

@Rob W: Puede que desee corregir el 'BY' en' document.getElementsBYClassName'. –

me encontré con esta situación. Aunque es demasiado antiguo, me gustaría ayudar a la gente con mi respuesta:

Para seleccionar todos los elementos (sin importar de qué se trate, puede ser div, span, h1, etc ...) con el atributo particular

Sin valor ?:

var dragables = document.querySelectorAll('[draggable]');

Con valor ?:

var dragables = document.querySelectorAll('[draggable="true"]');

Fuente

2016-06-11 12:54:29 David

document.querySelectorToda la longitud es siempre 0

Respuesta

Cuestiones relacionadas