动态生成Form

本文介绍了一种使用JavaScript跨浏览器创建表单的方法,并详细解释了如何在不同浏览器中(如IE和Firefox)创建表单元素及添加表单元素到DOM树的过程。
<script language="javascript" type="text/javascript">
<!--
  
//function that creates the form, adds some elements
  //and then submits it
  function select(id)
  {
    
var t = document.getElementById("t" + id);
    
var d = document.getElementById("d" + id);
    
var submitForm = getNewSubmitForm();
    createNewFormElement(submitForm, 
"name", t.innerHTML);
    createNewFormElement(submitForm, 
"remark", d.innerHTML);
    submitForm.action
= "quote.aspx";
    submitForm.submit();
  }

  
//helper function to create the form
  function getNewSubmitForm()
  {
    
var submitForm = document.createElement("FORM");
    document.body.appendChild(submitForm);
    submitForm.method 
= "POST";
    
return submitForm;
  }

  
//helper function to add elements to the form
  function createNewFormElement(inputForm, elementName, elementValue)
  {
    
var newElement = document.createElement("input");
    newElement.setAttribute(
"name",elementName);
    newElement.setAttribute(
"type","hidden");
    newElement.setAttribute(
"value",elementValue);
    inputForm.appendChild(newElement);
    
return newElement;
  }
//-->
</script>

注意document.createElement("FORM")来创建节点,在IE和Firefox下都可以

IE有3种方式都可以创建一个元素:
1 document.createElement("<input type=text>")
2 document.createElement("<input>")
3 document.createElement("input")

Firefox只支持一种方式:
document.createElement("input");document.setAttribute(name,value);

--------------

注: 在一个节点下增加子节点 IE也比Firefox下的方式要多.
IE: 
1 node.insertBefore(Element)
2 node.insertAfter(Element)
3 node.appendChild(Element)
而Firefox仅支持 node.appendChild.

转载于:https://www.cnblogs.com/shosky/archive/2011/07/14/2106774.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值