<li>要素の追加方法

質問

プログラムの最初で

<ul id="list">
<li></li><li></li><li></li>
</ul>

と書いておいて、javascript内でこの<li></li>の中に

site_names = ["1","2"];
site_urls = [" http://oshiete.goo.ne.jp/"," http://www.google. co.jp/"];

のような配列の要素やリンクを要素の追加をするにはどうしたら良いのでしょうか。

回答No.2

yambejp

なぜ最初からliが用意されているのか理解できないし、site_namesと
site_urlsに不整合が起こりそうでいまいち構造的によくなさそうですが
いま提示されている要素からつくるとこんな感じでしょうか？

<script>
window.onload=function(){
site_names = ["1","2"];
site_urls = ["http://oshiete.goo.ne.jp/","http://www.google.co.jp/"];
var lis=document.getElementById("list").getElementsByTagName("li");
for(var i=0;i<lis.length;i++){
if(site_names[i] && site_urls[i]){
var tag=document.createElement("a");
tag.setAttribute("href",site_urls[i]);
tag.appendChild(document.createTextNode(site_names[i]));
lis[i].appendChild(tag);
}
}
}
</script>

<ul id="list">
<li></li><li></li><li></li>
</ul>

回答No.1

noname#108428

id listのinnerHTMLを書き換えてみてはどうでしょう。

補足

回答ありがとうございます
例えば1つ目の
<li></li>
には
site_names　の　1　と
site_urls　の ​http://oshiete.goo.ne.jp　を
入れ、2つ目の
<li></li>
には
site_names　の　2　と
site_urls　の ​http://www.google.​ co.jp/　を
入れることはできるでしょうか？