js createElement appendChild createTextNode用法
生活随笔
收集整理的這篇文章主要介紹了
js createElement appendChild createTextNode用法
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
xml不支持innerHTML<p id="bj">北京</p><script type="text/javascript">//創建<div> 節點，添加到<body>節點中var divElement=document.createElement("div");divElement.innerHTML="<B>AFASFD</B>"//父親.appendChild(子)//document.getElementsByTagName("body")[0].appendChild(divElement);//獲取body的特殊的方式var bodyElement=document.body;bodyElement.appendChild(divElement);//另外一種添加值的方式，謹防不支持innerHTML的，比如xmlvar divElement=document.createElement("div");//創建文本節點var txtElement=document.createTextNode("呵呵啊");divElement.appendChild(txtElement);document.body.appendChild(divElement);</script>
1.創建鏈接
<script language="javascript">?
var?o = document.body;?
//創建鏈接?
function?createA(url,text)?
{?
var?a = document.createElement("a");?
a.href = url;?
a.innerHTML = text;?
a.style.color =?"red";?
o.appendChild(a);?
}?
createA("http://www.ffasp.com/","網頁教學網");?
</script>?
? 2.創建DIV
<script language="javascript">?
var?o = document.body;?
//創建DIV?
function?createDIV(text)?
{?
var?div = document.createElement("div");?
div.innerHTML = text;?
o.appendChild(div);?
}?
createDIV("網頁教學網：http://www.ffasp.com/");????
</script>?
3.創建表單項 <script language="javascript">?
var?o = document.body;?
//創建表單項?
function?createInput(sType,sValue)?
{?
var?input = document.createElement("input");?
input.type = sType;?
input.value = sValue;?
o.appendChild(input);?
}?
createInput("button","ooo");?
</script>?
4.創建表格 <script language="javascript">?
var?o = document.body;?
//創建表格?
function?createTable(w,h,r,c)?
{?
var?table = document.createElement("table");?
var?tbody = document.createElement("tbody");?
table.width = w;?
table.height = h;?
table.border = 1;????
for(var?i=1;i<=r;i++)?
{?
var?tr = document.createElement("tr");?
for(var?j=1;j<=c;j++)?
{?
var?td = document.createElement("td");?
td.innerHTML = i + "" + j;?
//td.appendChild(document.createTextNode(i + "" + j));?
td.style.color =?"#FF0000";?
tr.appendChild(td);?
}?
tbody.appendChild(tr);????
}?
table.appendChild(tbody);?
o.appendChild(table);?
}?
createTable(270,270,9,9);?
</script>
1.創建鏈接
<script language="javascript">?
var?o = document.body;?
//創建鏈接?
function?createA(url,text)?
{?
var?a = document.createElement("a");?
a.href = url;?
a.innerHTML = text;?
a.style.color =?"red";?
o.appendChild(a);?
}?
createA("http://www.ffasp.com/","網頁教學網");?
</script>?
? 2.創建DIV
<script language="javascript">?
var?o = document.body;?
//創建DIV?
function?createDIV(text)?
{?
var?div = document.createElement("div");?
div.innerHTML = text;?
o.appendChild(div);?
}?
createDIV("網頁教學網：http://www.ffasp.com/");????
</script>?
3.創建表單項 <script language="javascript">?
var?o = document.body;?
//創建表單項?
function?createInput(sType,sValue)?
{?
var?input = document.createElement("input");?
input.type = sType;?
input.value = sValue;?
o.appendChild(input);?
}?
createInput("button","ooo");?
</script>?
4.創建表格 <script language="javascript">?
var?o = document.body;?
//創建表格?
function?createTable(w,h,r,c)?
{?
var?table = document.createElement("table");?
var?tbody = document.createElement("tbody");?
table.width = w;?
table.height = h;?
table.border = 1;????
for(var?i=1;i<=r;i++)?
{?
var?tr = document.createElement("tr");?
for(var?j=1;j<=c;j++)?
{?
var?td = document.createElement("td");?
td.innerHTML = i + "" + j;?
//td.appendChild(document.createTextNode(i + "" + j));?
td.style.color =?"#FF0000";?
tr.appendChild(td);?
}?
tbody.appendChild(tr);????
}?
table.appendChild(tbody);?
o.appendChild(table);?
}?
createTable(270,270,9,9);?
</script>
總結
以上是生活随笔為你收集整理的js createElement appendChild createTextNode用法的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 不该被遗忘的nodeName、nodeV
- 下一篇： JS学习之Node类型