http://www.jb51.net/article/12856.htm
<html >
<head>
<title>动态添加表单元素</title>
</head>
<script language="javascript">
function AddElement(mytype){
var mytype,TemO=document.getElementById("add");
var newInput = document.createElement("input");
newInput.type=mytype;
newInput.name="input1";
TemO.appendChild(newInput);
var newline= document.createElement("br");
TemO.appendChild(newline);
}
</script>
<body>
<form action="" method="get" name="frm">
<div id="add">
<input type="text" name="textfield">
</div>
</form>
<input name="" type="button" value="新建文本框" onClick="AddElement('text')" />
<input name="" type="button" value="新建复选框" onClick="AddElement('checkbox')" />
<input name="" type="button" value="新建单选框" onClick="AddElement('radio')" />
<input name="" type="button" value="新建文件域" onClick="AddElement('file')" />
<input name="" type="button" value="新建密码框" onClick="AddElement('password')" />
<input name="" type="button" value="新建提交按钮" onClick="AddElement('submit')" />
<input name="" type="button" value="新建恢复按钮" onClick="AddElement('reset')" />
</body>
</html>
分享到:
相关推荐
本文实例讲述了JavaScript实现动态添加、移除元素或属性的方法。分享给大家供大家参考,具体如下: JavaScript 动态添加、移除元素 appendChild(newnode) 向节点的子节点列表的末尾添加新的子节点。 insertBefore...
<!... ; charset=gb2312" /> 无标题文档 function show() { var num1=document.getElementById('num1').value;... <input type="button" value="显示" onclick="show()" /> <div id="showDiv"></div> </html>
本文实例讲述了javascript元素动态创建实现方法。分享给大家供大家参考。具体分析如下: [removed]只能在页面加载过程中才能动态创建 可以调用document的createElement方法来创建具有指定标签的DOM对象,然后通过调用...
发布时候淡出效果,创建一个li,添加li的时候 不能直接采用 appendChild,这回直接添加到已有元素的后边,而微博效果是插入到前头,这是需要判断一下,当有元素时候采用 insertBefore方法,当没有元素时候采取...
代码过于简洁,就不多说废话了,直接奉上: 代码如下: [removed] ... var obj=document.createElement(“input”); obj.value=”1″; document.body.appendChild(obj); } [removed] <a>add</a>
appendChild的另一个功能是,先把元素从原有父级上删掉,然后添加元素到新的父级。(移除再添加)。 代码说明 <!DOCTYPE html> <html> <head> <title>appendChild的第二种功能</title&...
本文实例讲述了JavaScript动态添加style节点的方法。分享给大家供大家参考。具体如下: var css = 'h1 { background: red; }', head = document.getElementsByTagName('head')[0], style = document.createElement...
Uncaught HierarchyRequestError:Failed to excute ‘appendChild’ on ‘Node’:The new child element contains the parent. 在谷歌浏览器上: SCRIPT5022:DOM Exception:HIERARCHY_REQUEST_ERR(3) error 2、错误...
主要介绍了javascript使用appendChild追加节点的方法,实例分析了appendChild()函数增加结点的使用技巧,需要的朋友可以参考下
本文实例讲述了javascript与jquery动态创建html元素的方法。分享给大家供大家参考,具体如下: 1.javascript创建元素 创建select var select = document.createElement("select"); elect.options[0] = new Option(...
(1)最开始,想到原生JavaScript,jQuery (appendChild()等方法结合AngularJS来添加新的元素。但是突然发现控件里面的数据绑定,原生javascript没法控制。 (2)上网查资料,找到$compile服务,动态改变html内容。本...
用js创建动态表格一些基本语法 avascript 动态创建表格:新增、删除行和单元格 利用js来动态创建表格有两种格式,appendChild()和insertRow、insertCell()。
添加CSS的方式有行内式、嵌入式、外链式、导入式 a)动态引入样式表文件: 代码如下: function loadLink(url){ var link = document.createElement(“link”); link.type = “text/css”; link.rel = “stylesheet”;...
1.动态创建select 代码如下: function createSelect(){ var mySelect = document.createElement(“select”); mySelect.id = “mySelect”; document.body.appendChild(mySelect); } 2.添加选项option 代码如下: ...
代码如下:<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 ... <head> <title>appendChild,innerHTML,join</title> [removed]<...– //使用appendChild()方法添加span标签 function AppendD
前言 在文档对象模型 (DOM) 中,每个节点都是一个对象。DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 ...语法:appendChild(newnode) eg: 这是一个段落 这是另一个段落 </div>
JavaScript HTML DOM 元素 (节点) 本章节介绍如何向文档中添加和移除元素(节点)。 创建新的 HTML 元素 (节点) – appendChild() 要创建新的 HTML 元素 (节点)需要先创建一个元素,然后在已存在的元素中添加它。 ...