0

すべての記事要素に EventListener を追加しようとしているので、クリックするとドラッグ可能な要素に変わります。

このタスクでは jQuery を使用していません。

試行 1:

document.getElementsByTagName("ARTICLE").addEventListener('click', function(){
document.getElementsByTagName("ARTICLE").setAttribute('draggable', true);});

試行 2:

function draggableTrue() {
    var addDrag = document.getElementsByTagName("article");
    addDrag.setAttribute('draggable', true);
}

//add event listener to articles
var draggableArticles = document.getElementsByTagName("article");
draggableArticles.addEventListener('onclick', draggableTrue);

両方で、「Uncaught TypeError: undefined is not a function」というメッセージが表示されます。これは通常、何かが欠けていることを示していますが、読んだ後、何がわからないのですか。

4

2 に答える 2

2

document.getElementsByTagName はコレクションを返します。そのため、イベント リスナーを追加するには、それを反復処理する必要があります。このコレクションはネイティブ DOM ノード コレクションであり、jquery コレクションではないため、コレクションで addEventListener を使用することはできません。

var articles = document.getElementsByTagName("ARTICLE");
var eventListener = function(){console.log('clicked an articles')}

for(var i=0; i<articles.length; i++){
    articles[i].addEventListener('click', eventListener );
}
于 2014-08-12T11:17:23.390 に答える
0

さて、後者のケースを確認する必要があります。

しかし、別の問題があります。DOM 要素に関連するコードは、特定の要素が読み込まれたとき (または Javascript エンジンによって識別されたとき) に実行する必要があります。次のイベント (onload) は、ウィンドウがいつロードされるかを確認してから、割り当てられたクロージャーを実行します。window.onload = function(){}おそらく必要なものです。

window.onload = function(){
 // call your functions or document event listeners here
}

また、TagName、TagNameNS、および ClassName はすべて、反復したコレクションを返します。

var allDivs = document.getElementsByTagName("div");

for(var i = 0; i < allDivs.length; i++)
{
   allDivs[i].addEventListener();
}
于 2014-08-12T11:16:37.297 に答える