JS案例:将当前页面上第一个元素移到末尾

来自CloudWiki
跳转至: 导航搜索
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>移动页面元素示例</title>
<script type="text/javascript">
	function moveNode(){
	//获得父元素div
	var parNode=document.getElementById("div1");
	//获得divt第1个子元素
	var firstNode=parNode.firstChild;
	//将第1个子元素添加到div子元素列表的末尾
	parNode.appendChild(firstNode);
	}
</script>
</head>
<body> 
<div id="div1">
	<p>本学期开的第1门专业课程是Java</p>
	<p>本学期开的第2门专业课程是JavaScript</p>
	<p>本学期开的第3门专业课程是jQuery</p>
	<p>本学期开的第4门专业课程是JavaWeb</p>
</div>
    <form action="" method="get">
    <input type="button" value="将第1门课程Java移动末尾" onClick="moveNode()"/>
    </form>
</body>
</html>