javascript元素動態(tài)創(chuàng)建實現(xiàn)方法
更新時間：2015年05月13日 11:47:09 作者：永遠愛好寫程序
這篇文章主要介紹了javascript元素動態(tài)創(chuàng)建實現(xiàn)方法,涉及javascript操作元素的相關技巧,需要的朋友可以參考下
本文實例講述了javascript元素動態(tài)創(chuàng)建實現(xiàn)方法。分享給大家供大家參考。具體分析如下：
document.write只能在頁面加載過程中才能動態(tài)創(chuàng)建
可以調用document的createElement方法來創(chuàng)建具有指定標簽的DOM對象,然后通過調用元素的appendChild方法將
新創(chuàng)建元素添加到相應的元素下
舉例如下：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Dom動態(tài)創(chuàng)建元素</title>
<script type="text/javascript">
function CreateButton() {
var div = document.getElementById("divMain");
var myButton = document.createElement("input");
myButton.type = "button";
myButton.value = "我是動態(tài)添加的";
//myButton.id="btn"; 注意:如果設置id的話要避免重復
div.appendChild(myButton); //添加到div上
}
</script>
</head>
<body>
<div id="divMain"></div>
<input type="button" value="添加元素" onclick="CreateButton()" />
</body>
</html>
希望本文所述對大家的javascript程序設計有所幫助。
相關文章
今天小編就為大家分享一篇解決layer圖標icon不加載的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
本篇文章主要介紹了JS高仿拋物線加入購物車特效實現(xiàn)代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下。2017-02-02
這篇文章主要為大家詳細介紹了JavaScript中手寫Promise的一些常見方法,文中的示例代碼講解詳細,具有一定的借鑒價值,需要的可以參考一下2023-09-09
uniapp開發(fā)小程序實現(xiàn)滑動頁面控制元素的顯示和隱藏效果
這篇文章主要介紹了uniapp開發(fā)小程序實現(xiàn)滑動頁面控制元素的顯示和隱藏效果,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2020-12-12
本文給大家介紹的是javascript中的靜態(tài)屬性和原型屬性，并附上示例分析，十分的實用，有需要的小伙伴可以參考下。2015-05-05
javascript下查找父節(jié)點的簡單方法...2007-08-08
這篇文章主要介紹了Django模板繼承 extend標簽實例代碼，非常不錯，具有一定的參考借鑒價值 ,需要的朋友可以參考下2019-05-05
使用 JavaScript 和 canvas 壓縮圖像可以使用 canvas 的 drawImage() 方法將圖像繪制到 canvas 上，然后使用 toDataURL() 方法將圖像轉換為 Data URL 形式，這篇文章主要介紹了JavaScript 圖像壓縮的相關資料,需要的朋友可以參考下2023-01-01
JavaScript 拖拽實現(xiàn)（附注釋），最經(jīng)典簡單短小精悍！
JavaScript拖拽實現(xiàn)（附注釋），最經(jīng)典！最簡單！短小精悍！2009-04-04
ts中數(shù)據(jù)類型的定義是重點之一,所以必須明確ts有哪些數(shù)據(jù)類型,下面這篇文章主要給大家介紹了關于Typescript中數(shù)據(jù)類型的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-03-03