最近做个小项目,用到了DOM进行动态写标签。
JS:
function addLoadEvent(func){
var oldοnlοad=window.onload;//获取已经存在的window.onload事件
if (typeof window.onload!='function'){
window.οnlοad=func;//如果window.onload没有事件,那就将func赋给它
}else {
window.οnlοad=function(){
oldonload();
func();//否则将func加到window.onload所有事件的末尾
}
}
}
function insertCopyright(){
var parentEle=document.getElementsByTagName("body")[0].lastChild;//获取BODY的最后一个节点元素
if (parentEle){
createEles(parentEle);//如果这个元素存在,则调用createEles函数
}
else return false;
}
function createEles(parent){
var textFirst=document.createElement("p");
var textSecond=document.createElement("p");
var textThird=document.createElement("p");
var textFourth=document.createElement("a");
var textE1=document.createTextNode("XXLJFLJALJFLSJFLJ公司");
var textE2=document.createTextNode("联系电话:86-sfsfsffsf");
var textE3=document.createTextNode("技术支持:");
var textE4=document.createTextNode(www.abc.com);
parent.appendChild(textFirst);
parent.appendChild(textSecond);
parent.appendChild(textThird);
textFirst.appendChild(textE1);
textSecond.appendChild(textE2);
textThird.appendChild(textE3);
textThird.appendChild(textFourth);
textFourth.appendChild(textE4);
textFourth.href=http://www.abc.com;
}
addLoadEvent(insertCopyright);
-----------------------------
<!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=gb2312" />
<title>某某某</title>
<script type="text/javascript" src="scripts/insertCopyright.js"></script>
</head>
<body>
<div id="content_right_container">
<div id="content_right_first">
<ul>
<li class="proList"><a href="products/jtie.html"><img src="images/index_p_1.jpg" /></a></li>
<li class="proList"><a href="products/pjian.html"><img src="images/index_p_2.jpg" /></a></li>
<li class="proList"><a href="products/yanglizi.html"><img src="images/index_p_3.jpg" /></a></li>
<li class="proList"><a href="products/gyjxwsn.html"><img src="images/index_p_4.jpg" /></a></li>
<li class="proList"><a href="products/flzi.html"><img src="images/index_p_5.jpg" /></a></li>
</ul>
</div>
<div id="content_right_second">
<ul>
<li class="proList"><a href="products/jhyhl.html"><img src="images/index_p_6.jpg" /></a></li>
<li class="proList"><a href="products/mfan.html"><img src="images/index_p_7.jpg" /></a></li>
<li class="proList"><a href="products/bxxan.html"><img src="images/index_p_8.jpg" /></a></li>
<li class="proList"><a href="products/ylzi.html"><img src="images/index_p_9.jpg" /></a></li>
<li class="proList"><a href="products/spjxwsn.html"><img src="images/index_p_10.jpg"/></a></li>
</ul>
</div>
</div>
</div>
</div>
<div id="bottom">
</div>
</body>
</html>