简单实现通过JavaScript来增加HTML节点

  1. <!DOCTYPE html>
  2. <html>
  3.   <head>
  4.     <title>JavaScript在末尾添加节点</title>
  5.     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  6. 	<script type="text/javascript" >
  7. 		function add()
  8. 		{
  9. 			var lnode=document.createElement("li");
  10. 			var ltext=document.createTextNode("2222");
  11. 			lnode.appendChild(ltext);
  12. 			document.getElementById("uid").appendChild(lnode);
  13. 		}
  14. 	</script>
  15.   </head>
  16.   <body>
  17.   	<ul id="uid">
  18.   		<li>1111</li>
  19.   		<li>1111</li>
  20.   		<li>1111</li>
  21.   	</ul>
  22.   	<input type="button" value="添加" onclick="add();"/>
  23.   </body>
  24. </html>

　　运行结果示意：

JavaScript案例二：在末尾添加节点的更多相关文章

  1. JavaScript基础1——在末尾添加节点

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. js实现在末尾添加节点

    在末尾添加节点: 1.获取ul标签 2.创建li标签 document.createElement("标签名称")方法 3.创建文本 document.createTextNode ...

  3. JavaScript实验一(添加节点，删除节点)

    静态html页面: <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...

  4. 初探JavaScript（二）——JS如何动态操控HTML

    除去五一三天,我已经和<JavaScript Dom编程艺术>磨合了六天,第一印象很好.慢慢的,我发现这是一块排骨,除了肉还有骨头.遇到不解的地方就会多看几遍,实在不懂的先跳过,毕竟,初次 ...

  5. 从头开始学JavaScript (十二)——Array类型

    原文:从头开始学JavaScript (十二)--Array类型 一.数组的创建 注:ECMAscript数组的每一项都可以保存任何类型的数据 1.1Array构造函数 var colors = ne ...

  6. 第二章 JavaScript案例（中）

    1. js事件 HTML代码 <!DOCTYPE html> <html lang="en" onUnload="ud()"> < ...

  7. 2、JavaScript 基础二 （从零学习JavaScript）

     11.强制转换 强制转换主要指使用Number.String和Boolean三个构造函数,手动将各种类型的值,转换成数字.字符串或者布尔值. 1>Number强制转换 参数为原始类型值的转换规 ...

  8. JS添加节点方法与JQuery添加节点方法的比较及总结

    原生JS添加节点方法与JQuery添加节点方法的比较及总结   一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div ...

  9. JavaScript案例开发之扑克游戏

    随着时代的发展,知识也在日益更新,但是基础知识永远不会过时,它是新时代的基石,更是我们进一步学习的保障,下面带着大家用JavaScript开发一款真正的扑克游戏,和大家一起分享,希望你们能够喜欢:闲话 ...

随机推荐

  1. 实现JavaScript自定义函数的整合、链式调用及类的封装

    函数声明形式:表单验证函数 1 2 3 4 5 6 7 8 9 10 11 12 13 function checkName(){     console.log('检查用户名'); } functi ...

  2. asp.net过滤数据中有异常数据字符串

    /// <summary> /// 过滤数据 /// </summary> /// <param name="_str"></param& ...

  3. 错误 1 未知的服务器标记“asp:ScriptManager”。

    如题 ... 解决方案 :将 <%@ Register Assembly="System.Web.Extensions, Version=1.0.61025.0, Culture=ne ...

  4. Android/iOS微信6.3.5同时发布更新 支持群视频聊天、群公告

    下午微信6.3.5发布更新,新版最大变化就是支持群视频聊天,又一次向手机QQ靠拢.在群管理方面,支持发布群公告,支持群主转让给其他群成员,同样都是QQ玩剩下的功能.另外,新版支持微信运动查看步数图表. ...

  5. Rescue

    1039: Rescue Time Limit: 1 Sec  Memory Limit: 32 MBSubmit: 1320  Solved: 306 Description Angel was c ...

  6. XSS的DOS攻击之 server limit dos

    墨西哥同学周末很郁闷的在宾馆上网,发现youtube被ban了,于是写个了tool解决这个问题.顺带想到了一种利用 google 统计的漏洞,写在这里了 http://sirdarckcat.blog ...

  7. Tooltip jqueryui

    (文章是从我的个人主页上粘贴过来的,大家也可以访问我的主页 www.iwangzheng.com) http://jqueryui.com/tooltip/ <meta charset=&quo ...

  8. ZeroMQ安装

    一.ZeroMQ介绍 ZeroMQ是一个开源的消息队列系统,按照官方的定义,它是一个消息通信库,帮助开发者设计分布式和并行的应用程序. 首先,我们需要明白,ZeroMQ不是传统的消息队列系统(比如Ac ...

  9. SpringMVC+MyBatis+EasyUI 实现分页查询

    user_list.jsp <%@ page import="com.ssm.entity.User" %> <%@ page pageEncoding=&quo ...

  10. Python字符串与数字互转，数字格式化

    # -*- coding: gbk -*- import re #将数字格式化为带三位数逗号的字符串 def formatNumber(number): numStr='%d'%number form ...