对于这个内容光看标题大家可能不是很明白,我就在下边写一个简单的例子
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<style type="text/css">
#main{width:960px;height:600px;background:blue;}
#main p{width:960px;height:300px;background:red;}
</style>
</head>
<body>
<div id="main"></div>
<script type="text/javascript">
function $(eve){
return document.getElementById(eve);
}
var main=$("main");
var op=document.createElement("p");
var oinput=document.createElement("input");
op.appendChild(oinput);
//对p 标签 添加 点击事件
op.οnclick=function(event){
alert(event);//这个将会打印出一个鼠标事件
var objdiv=window.event||event;
var odiv=objdiv.target||objdiv.srcElement;//获取目标
//然后对这个目标操作即可假如这个p 其他事件也都可以这样添加,
//通过这个控制它的子节点 父节点都没问题,
//举例 通过目标控制子节点给oinput.value赋值
odiv.firstChild.value=10;
//这个input标签的value=10;网页上这个input标签里面的内容将显示为10;
}
//将 一个p标签 加到 div中
main.appendChild(op);
</script>
</body>
</html>
上面的代码就是对用js增加的节点添加一个点击事件的例子,p标签内input标签的value默认为空 ,而我点击了用js添加的p标签时 会产生一个点击事件 而后会给p标签内的input标签的value赋值为10,input内标签在网页中显示为10;