2017-06-15 22 views
0
<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Document</title> 
</head> 
<body> 
    <input id="wb" type="text" /> 
    <input id="an" type="button" value="按钮" /> 
    <ul id="ul1"> 

    </ul> 
    <script> 
     window.onload=function() 
     { 
      var oWb = document.getElementById("wb"); 
      var btn = document.getElementById("an"); 
      var oUl = document.getElementById("ul1"); 
      btn.onclick=function() 
      { 
       var oLi = document.createElement("li"); 

       oLi.innerHTML = oWb.value; 
       oUl.insertBefore(oLi,oLi[0]); 

      } 
     } 
    </script> 
</body> 
</html> 

私はそれぞれのクリックを挿入したいと思いますが、liの前に挿入して、次にoUl​​.insertBefore(oLi、oLi [0]); oLi [0]に挿入することを選ぶ理由は何ですか?すべてのクリックでliを作成するのではなく、最初の0をこのインデックスに挿入しても問題ありません。新しく作成された子ノードが無効になる前に挿入されていますか?

+0

'oLi'はあなたが作成したばかりのリスト項目です。 'oLi [0]'にアクセスしようとすると意味がありません。リストの最初の子を参照するだけの場合は、それを実行してください。 'oUl.firstChild' – CBroe

+0

@CBroe彼が聞いたことを翻訳してください。 – Sagar

答えて

0

あなたは誤解してhow insertBefore worksです。 oLi要素には[0]プロパティもありません。代わりに、oLiが前面に挿入されるようにoUl.firstChildを渡したいと思うでしょう。

oUl.insertBefore(oLi, oUl.firstChild); 
+0

私はvar aLi = oUl.getElementsByTagName( "li")を追加して通知のインデックスを挿入する方法があります。次に、getElementsByTagNameを作成する必要がないかどうか尋ねます。このタグのインデックスを使用できますか? – hope

+0

はい、 ['oUl.childNodes [index]'](https://developer.mozilla.org/en-US/docs/Web/API/Node/childNodes) または['oUl.children [index]']を使用することもできます(https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/children) – Bergi

関連する問題