您的位置：首页 > 编程语言

【DOM编程艺术】动态创建标签

2014-04-15 11:26 197 查看

<!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>
</head>

<body>
<script>
window.onload=function(){
var testdiv=document.getElementById('testdiv');
var para=document.createElement('p');
var txt1=document.createTextNode('This is ');
para.appendChild(txt1);
var emphasis=document.createElement('em');
var txt2=document.createTextNode('my ');
emphasis.appendChild(txt2);
para.appendChild(emphasis);
var txt3=document.createTextNode('content.');
para.appendChild(txt3);
testdiv.appendChild(para);   //Javascript代码执行后，testdiv里会插入一元素  <div id='testdiv'><p>This is <em>my</em> content.</p></div>
}
</script>
<div id='testdiv'></div>
</body>
</html>

另一种方案就是先创建所有的节点，然后再把它们连接在一起。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航