document.querySelectorTất cả độ dài luôn là 0

Tôi đang cố gắng tạo một số hộp có thể kéo trong javascript. Tôi quyết định tạo một lớp trống "có thể kéo" trong CSS và một lớp "hộp". Mã này là như sau:document.querySelectorTất cả độ dài luôn là 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>

Vấn đề là tabLength luôn là zero. Tôi muốn có được một mảng đầy những thứ có thể kéo được. Tôi mới sử dụng javascript. Tôi đã bỏ lỡ điều gì ở đây?

Nguồn

2012-03-06 Michael

Bạn muốn chọn các yếu tố của lớp, vì vậy đừng quên dấu chấm:

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

Một lựa chọn khác là sử dụng document.getElementsByClassName:

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

Nguồn

2012-03-06 21:15:55

Cảm ơn rất nhiều! Nó hoạt động! – Michael

@Michael Np. Lời khuyên cho lần sau, trước khi hỏi tại sao một cái gì đó không hoạt động, hãy chắc chắn rằng bạn đã đọc tài liệu chính xác. Đối với JavaScript/CSS/HTML, Mạng nhà phát triển Mozilla nói chung là một mạng tốt. Thêm 'mdn' vào truy vấn tìm kiếm của bạn, ví dụ: ['querySelectorAll mdn'] (http://www.google.com/search?q=mdn+querySelectorAll) và bạn thường nhận được tài liệu phù hợp ngay lập tức: https://developer.mozilla.org/En/DOM/Document .querySelectorAll –

@Rob W: Có thể muốn sửa 'BY' trên' document.getElementsBYClassName'. –

Tôi đã xem qua tình trạng này. Mặc dù bài đăng cũ quá tôi muốn giúp mọi người với câu trả lời của tôi:

Để chọn tất cả các phần tử (bất kể nó là gì, nó có thể là div, span, h1, v.v ...) với thuộc tính cụ thể

Nếu không có giá trị ?:

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

Với giá trị ?:

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

Nguồn

2016-06-11 12:54:29 David

document.querySelectorTất cả độ dài luôn là 0

Trả lời

Các vấn đề liên quan