JS簡單實現(xiàn)動態(tài)添加HTML標記的方法示例
更新時間：2018年04月08日 11:39:17 作者：chengqiuming
這篇文章主要介紹了JS簡單實現(xiàn)動態(tài)添加HTML標記的方法,結合實例形式分析了JavaScript使用createElement()方法針對頁面元素進行動態(tài)操作相關實現(xiàn)技巧,需要的朋友可以參考下
本文實例講述了JS簡單實現(xiàn)動態(tài)添加HTML標記的方法。分享給大家供大家參考，具體如下：
一 介紹
動態(tài)添加一個HTML標記可以使用createElement()方法來實現(xiàn)。
CreateElement()方法可以根據(jù)一個指定的類型來創(chuàng)建一個HTML標記。
語法：
sElement=document.createElement(sName)
sElement：用來接收該方法返回的一個對象。
sName：用來設置HTML標記的類型和基本屬性。
二 應用
動態(tài)添加一個文本框
本示例通過單擊“動態(tài)添加文本”按鈕，將在頁面中動態(tài)添加一個文本框。
三 代碼
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>m.fzitv.net 動態(tài)添加HTML標記</title>
<script language="javascript">
<!--
function addText()
{
var txt=document.createElement("input");
txt.type="text";
txt.name="txt";
txt.value="動態(tài)添加的文本框";
document.fm1.appendChild(txt);
}
-->
</script>
</head>
<body>
<form name="fm1">
<input type="button" name="btn1" value="動態(tài)添加文本框" onclick="addText();" />
</form>
</body>
</html>
四 運行結果
更多關于JavaScript相關內(nèi)容感興趣的讀者可查看本站專題：《JavaScript頁面元素操作技巧總結》、《JavaScript操作DOM技巧總結》、《JavaScript查找算法技巧總結》、《JavaScript數(shù)據(jù)結構與算法技巧總結》、《JavaScript遍歷算法與技巧總結》及《JavaScript錯誤與調(diào)試技巧總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章
本篇文章通過js和css結合實現(xiàn)簡單的吞噬效果，代碼簡單易懂，需要的朋友可以參考下本文2015-09-09
下面小編就為大家?guī)硪黄鷍s封裝運動框架的示例講解。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
這篇文章主要介紹了JavaScript使用cookie記錄臨時訪客信息的方法,涉及javascript操作cookie的技巧,非常具有實用價值,需要的朋友可以參考下2015-04-04
Cookie 是瀏覽器訪問服務器后，服務器傳給瀏覽器的一段數(shù)據(jù)。瀏覽器需要保存這段數(shù)據(jù)，不會輕易刪除（保存在計算機中）。此后每次瀏覽器訪問該服務器，都必須帶上這段數(shù)據(jù)。這篇文章主要介紹了javascript和jquery中cookie的設置方法2023-07-07
JavaScript根據(jù)CSS的Media Queries來判斷瀏覽設備的方法
這篇文章主要介紹了JavaScript根據(jù)CSS的Media Queries來判斷瀏覽設備的方法,主要思路是通過CSS Media Queries改變一個類的某個屬性值(例如 z-index),然后用JavaScript讀取判斷,需要的朋友可以參考下2016-05-05
解決layui中table異步數(shù)據(jù)請求不支持自定義返回數(shù)據(jù)格式的問題
今天小編就為大家分享一篇解決layui中table異步數(shù)據(jù)請求不支持自定義返回數(shù)據(jù)格式的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08
js es6系列教程 - 新的類語法實戰(zhàn)選項卡(詳解)
下面小編就為大家?guī)硪黄猨s es6系列教程 - 新的類語法實戰(zhàn)選項卡(詳解)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
簡單談談javascript中的變量、作用域和內(nèi)存問題
這篇文章主要介紹了簡單談談javascript中的變量、作用域和內(nèi)存問題的相關資料,需要的朋友可以參考下2015-08-08
使用TypeScript實現(xiàn)一個類型安全的EventBus示例詳解
EventBus是工作中常用的工具,本文用Typescript實現(xiàn)一個具備基礎功能且類型安全的EventBus，是我近期學習Typescript的知識總結，對TypeScript實現(xiàn)EventBus相關知識感興趣的朋友一起看看吧2022-06-06
這篇文章主要介紹了javascript框架設計之瀏覽器的嗅探和特征偵測的相關資料,需要的朋友可以參考下2015-06-06