将Ul1中的li搬到Ul2中的li中

DB-Ruan

于 2014-08-27 00:56:05 发布

阅读量456

点赞数

分类专栏： JavaScript 技术日志

本文链接：https://blog.csdn.net/feizhoujeep/article/details/38859749

版权

JavaScript 同时被 2 个专栏收录

25 篇文章 0 订阅

订阅专栏

技术日志

23 篇文章 0 订阅

订阅专栏

原理：

在UL2中appendChild()UL1中的的LI元素。appendChild插入本身相同元素会删除该元素并排在最后。

代码：

<html>
	<head>
		<meta charset="utf-8"/>
		<title>搬移li</title>
		<script>
			window.οnlοad=function(){
				var oUl1=document.getElementById("ul1");
				var oLi=oUl1.getElementsByTagName("li");
				var oUl2=document.getElementById("ul2");
				var oBtn=document.getElementById("btn1");
				oBtn.οnclick=function(){
					oUl1.appendChild(oUl1.firstElementChild);
				};
			}
		</script>
	</head>
	<body>
		<ul id="ul1">
			<li>我爱你1</li>
			<li>我爱你2</li>
			<li>我爱你3</li>
			<li>我爱你4</li>
		</ul>
		<input type="button" value="将第一个元素移动到最下面" id="btn1"/>
	</body>
</html>