関数クロージャーが外部関数の変数を表示する

Question

こんにちは私はクロージャーを試していますが、画像をクリックする前に "10 likes"を印刷する方法を理解できませんでしたか？私にこれを手伝ってくれる人がいますか？

var clickCount = (function() { 
 
\t var clickCounter = 10; //start from 10 likes 
 
\t return function() { 
 
\t \t var amountOfLikes = document.getElementById("counter"); 
 
\t \t amountOfLikes.innerHTML = clickCounter + " likes"; //increment the likes 
 
\t \t clickCounter++; 
 
\t } 
 
})();

<img src="http://image.flaticon.com/icons/png/128/148/148836.png" id="like_button" alt="like-button" onclick="clickCount()"/><span id="counter"></span>

Answer 1

いくつかの提案：

1. はあなたがthis.Youができるため閉鎖を必要といけないのjavascript
2. でイベントを処理するようにしてくださいJavaScriptの
3. でマークアップを混ぜることはありません10をマークアップし、値を増加させ続けるonclickだけを続ける

window.onload = function() { 
 
    document.getElementById("counter").addEventListener('click', clickCount); 
 
} 
 

 
function clickCount() { 
 
    var amountOfLikes = document.getElementById("counter"); 
 
    var likes = parseInt(amountOfLikes.innerHTML, 0); 
 
    amountOfLikes.innerHTML = likes + 1; 
 
}

<img src="http://image.flaticon.com/icons/png/128/148/148836.png" id="like_button" alt="like-button" onclick="clickCount()"/><span id="counter">10 </span> likes

これは

を役に立てば幸い