document.querySelectorAllの長さは常に0です

私はいくつかのドラッグ可能なボックスをjavascriptで作成しようとしています。私はCSSと "ボックス"クラスで空のクラスを "ドラッグ可能"にすることにしました。コードは以下の通りである：document.querySelectorAllの長さは常に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>

問題はtabLengthは常にゼロであるということです。私はすべてのdraggableものでいっぱいの配列を取得したい。私はJavaScriptに新しいです。私はここで何を逃したのですか？

出典

2012-03-06 Michael

あなたはクラスで要素を選択したいので、ドットを忘れないでください：

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

別のオプションは、document.getElementsByClassNameを使用することです：

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

出典

2012-03-06 21:15:55

どうもありがとう！できます！ – Michael

@Michael Np。次回のヒント、何かがうまくいかない理由を尋ねる前に、正しいドキュメントを必ず読んでください。 JavaScript/CSS/HTMLの場合、一般にMozilla Developer Networkは良いものです。あなたの検索クエリに 'mdn'を追加してください。 ['querySelectorAll mdn']（http://www.google.com/search?q=mdn+querySelectorAll）、すぐに正しい文書をすぐに入手できます：https://developer.mozilla.org/En/DOM/Document .querySelectorAll –

@Rob W： 'document.getElementsBYClassName'で' BY'を修正したいかもしれません。 –

私はこのような状況に出くわしました。それはあまりにも古い投稿ですが、私は私の答えを持つ人々を助けたいと考えています：

特定の属性を持つすべての要素を（それが何であれdiv、span、h1、...など）選択するには

値なし

？：

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

値付き？：

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

出典

2016-06-11 12:54:29 David

document.querySelectorAllの長さは常に0です

答えて

関連する問題