源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

Js为表单动态添加节点内容的方法

  • 时间:2020-07-18 10:25 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:Js为表单动态添加节点内容的方法
本文实例讲述了Js为表单动态添加节点内容的方法。分享给大家供大家参考。具体如下: 1. 代码
[u]复制代码[/u] 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml">  <head>  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  <title>增加节点</title>  <script type="text/javascript">     function newPicture() {         var picElement = document.createElement("img");         picElement.src = "images/success.jpg";         picElement.width = 100;         picElement.height = 100;         document.body.appendChild(picElement);     }          function newNode() {         var olElement = document.getElementById('answers');         var liElement = document.createElement('li');                  var inputElement = document.createElement('input');         inputElement.type = "text";         inputElement.name = "answer";                  liElement.appendChild(inputElement);         olElement.appendChild(liElement);     }  </script>  </head>    <body>   <div>      <input type="button" name="button" value="增加一张图片" onclick="javascript:newPicture();"/>         <input type="button" name="button" value="增加一个选项" onclick="javascript:newNode();"/><br />      <ol id="answers">          <li><input type="text" name="answer" /></li>      </ol>   </div>  </body>  </html>
2. 程序效果图: [img]http://files.jb51.net/file_images/article/201502/2015210103521447.gif?2015110103853[/img] 希望本文所述对大家的javascript程序设计有所帮助。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部