请教js问题

hebsxl2000 2012-08-22 04:00:14



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script type="text/javascript">

function test(){

	

var ul = document.createElement('ul');

var li = document.getElementsByTagName('li');

for(var i=0; i< li.length; i++){

	alert(li.length);

	ul.appendChild(li[i]);

}

document.body.appendChild(ul);



}

</script>

</head>



<body>

<ul>

	<li>1</li>

    <li>2</li>

    <li>3</li>

</ul>

<input type="button" onclick="test()" />

</body>

</html>

请问这种方式页面只能获得1和3 2却消失了

...全文

84 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

hebsxl2000 2012-08-23

打赏
举报

谢谢几位的回答，明白了

xinhongjian_123 2012-08-22

打赏
举报

因为你是从页面上取的li标签，然后append到ul上的，所以你每次append到ul上时，页面li节点就会少一个，li.length也会减少。第一次是将li[0]append到ul(也就是将1加到ul里了)，i变为1，li.length也减少为2个了，这时页面上只有两个li节点了，排列顺序还是从0开始的，所以当i变为1时，只能取值为3的li节点，如果想要得到所有li节点，可以这样修改程序：
function test(){

var ul = document.createElement('ul');
var li = document.getElementsByTagName('li');
var l = li.length;
for(var i=0; i<l; i++){
// alert(li.length);
ul.appendChild(li[0]);

}
document.body.appendChild(ul);

}

it491328322 2012-08-22

打赏
举报



function test(){

    

var ul = document.createElement('ul');



var li = document.getElementsByTagName('li');

for(var i=li.length - 1; i>=0 ; i--){

    ul.appendChild(li[i]);

}

document.body.appendChild(ul);



}

把循环顺序倒过来写就可以了。。。

这是因为你每次ul.appendChild(li[i]);的时候，li的长度就减掉1了。。。

anglechengd 2012-08-22

打赏
举报

请问这种方式页面只能获得1和3 2却消失了?
答：LZ注意这段代码运行时的两个提示框，第一次是3，第二次是2，这个提示的是li.length。
那么想想看，这个数字变化的原因？
其实是因为1这个li被移到你新建的ul中，所以长度少1。
解决了这个疑问，我们来看i的变化？
当i=0时，将内容为1的li移到ul中，
当i=1时，注意因为此时的长度变为2了，
看看li[i]的情况：li[0]=2，li[1]=3.
所以将内容为3的li移到ul中。