動的に正しく追加されたdiv数を取得できません

私はbody要素を持っています。このbody要素には、idがfullpageの子要素があります。この要素には、クラス名がsectionの子要素が含まれています。動的に正しく追加されたdiv数を取得できません

function load_works() { 

    var container = document.getElementById('fullpage'); 

     for (var i = 0; i < 2; i++) { 
      var new_section = document.createElement('div'); 
      new_section.className = "section"; 

      container.appendChild(new_section); 
     } 

}

問題は、私はload_works()後にこのようなgetElementsByClassName()でsection要素をカウントしようとすると、

を実行していることを、次のとおりです。機能 load_works()で私は2つの以上 section要素

main.jsの

<body> 

    <div id="fullpage"> 

     <div class="section"> 
       <!-- Content --> 
     </div> 

    </div> 


    <script src="js/main.js" charset="utf-8"></script> 
    <script type="text/javascript"> 
     load_works(); 
    </script> 


</body>

内容を追加します

function some_function() { 

    var sections = document.getElementsByClassName('section'); 
    console.log(sections.length); 

}

これは常に1を返します。これは、スタティック01が1つしかないためです要素。もちろん、querySelectorAll()などもありません。だから、どのようにjQueryではなく、純粋なJavascriptで正しい結果を得ることができますか？

出典

2016-03-31 vanelizarov

main.jsのように1つのファイル内にすべてのjavascriptを置き、load_works()の後にsome_function()に電話するだけです。

function load_works() { 
 
    var container = document.getElementById('fullpage'); 
 
    for (var i = 0; i < 2; i++) { 
 
    var new_section = document.createElement('div'); 
 
    new_section.className = "section"; 
 
    container.appendChild(new_section); 
 
    } 
 
} 
 

 
function some_function() { 
 
    var sections = document.getElementsByClassName('section'); 
 
    alert(sections.length); 
 
} 
 

 
load_works(); 
 
some_function();

<div id="fullpage"> 
 
    <div class="section"> 
 
    <!-- Content --> 
 
    </div> 
 
</div>

出典

2016-03-31 14:25:13 NiZa

動的に正しく追加されたdiv数を取得できません

答えて

関連する問題