js動態新增一個按鈕並且註冊事件處理函式程式碼例項

螞蟻小編發表於2017-03-25

本章節介紹一下如何如何動態的建立一個按鈕並且為這個按鈕註冊事件處理函式。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>螞蟻部落</title> 
<script type="text/javascript"> 
function done(){
  var odiv=document.getElementById("thediv");
  odiv.innerHTML="螞蟻部落";
}
function onloadEvent(){ 
  var input=document.createElement("input");
  input.type="button";
  input.value="檢視效果";
  input.setAttribute("onclick","done()");
  document.body.appendChild(input);
} 
window.onload=function(){
  onloadEvent();
}
</script> 
</head> 
<body> 
<div id="thediv"></div>
</body> 
</html>

上面的程式碼實現了我們的要求,可以動態的建立一個按鈕,並且為按鈕註冊了點選事件處理函式。

相關文章