js---Dom给元素添加事件的两种方式

1.按照事件三要素的语法来添加事件,这种方式能让html元素和js脚本分离

例如：

Html元素：
  <input type="button" id="btn1" value="插入节点到末尾" />
Js脚本
 <script>
       	  var btn1=document.getElementById('btn1');
       	  //父节点
       	  var div=document.getElementById('parent');
       	  //给按钮添加单击事件
       	  btn1.onclick=function(){
       	  	  //1.创建节点
       	  	 var h2= document.createElement('h2');
       	  	 h2.innerHTML="我是新标题标签";
       	  	 //2.往父节点中插入
       	  	 div.appendChild(h2);
       	  }
  </script>

2.直接在元素上添加事件,这种方式是将html元素和事件混在一起

语法：事件名=”函数()”
例如：

<input type="button" name="btn2" value="删除一行" onclick="deleteRow(this)">
Js脚本
	function deleteRow(btn){
		 		 //通过删除按钮找到它所在的行，再删除行
		 		var tr= btn.parentNode.parentNode;
		 		tr.parentNode.removeChild(tr);
	}