關於在html中怎樣經過js 對經過js建立的節點增長各類事件

時間 2019-11-13

標籤關於 html 怎樣經過建立節點增長各類事件欄目 HTML 简体版

原文原文鏈接

對於這個內容光看標題你們可能不是很明白，我就在下邊寫一個簡單的例子 javascript

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" css

"http://www.w3.org/TR/html4/loose.dtd"> html

<html> java

<head> app

<title></title> ui

#main{width:960px;height:600px;background:blue;} 事件

#main p{width:960px;height:300px;background:red;} ip

</style>

</head>

<body>

function $(eve){

return document.getElementById(eve);

}

var main=$("main");

var op=document.createElement("p");

var oinput=document.createElement("input");

op.appendChild(oinput);

//對p 標籤添加點擊事件

op.onclick=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；

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。