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

<!DOCTYPE html>

<html>

  <head>

    <title>JavaScript在末尾添加节点</title>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

	<script type="text/javascript" >

		function add()

		{

			var lnode=document.createElement("li");

			var ltext=document.createTextNode("2222");

			lnode.appendChild(ltext);

			document.getElementById("uid").appendChild(lnode);

		}

	</script>

  </head>

  <body>

  	<ul id="uid">

  		<li>1111</li>

  		<li>1111</li>

  		<li>1111</li>

  	</ul>

  	<input type="button" value="添加" onclick="add();"/>

  </body>

</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. PHP常量PHP_SAPI与函数php_sapi_name()简介，PHP运行环境检测

    php_sapi_name() 是用来检测PHP运行环境的函数. 该函数返回一个描述PHP与WEB服务器接口的小写字符串. 例如:aolserver, apache,apache2filter, ap ...

  2. [Effective JavaScript 笔记]第4章：对象和原型--个人总结

    前言 对象是js中的基本数据结构.对象在js语言编码中也随处可见,比如经常会用到的函数,也是一个Function构造函数,Function.prototype原型对象.每当声明一个函数时,都会继承Fu ...

  3. javascript 重写已有的方法

    现在有一个需求,需要重写方法,比如方法名为a,但是在方法内部,需要用到原来的方法,怎么办? 最直接的办法是: var b = a; window.a = function(args){ a.call( ...

  4. encode和decode

    Python字符串的encode与decode研究心得乱码问题解决方法 为什么会报错“UnicodeEncodeError: 'ascii' codec can't encode characters ...

  5. 利用jQuery.validate异步验证用户名是否存在

    转:http://www.cnblogs.com/linzheng/archive/2010/10/14/1851781.html HTML头部引用: <script type="te ...

  6. sql SELECT时的with(nolock)选项说明

    I used to see my senior developers use WITH (NOLOCK) when querying in SQL Server and wonder why they ...

  7. C#模拟百度登录

    目录: 1.fiddler解析百度登录地址 2.处理传入参数 1.fiddler解析百度登录地址 因工作需要,所以研究了下百度的登陆.首先打开https://passport.baidu.com/v2 ...

  8. Python网络编程（4）——异步编程select & epoll

    在SocketServer模块的学习中,我们了解了多线程和多进程简单Server的实现,使用多线程.多进程技术的服务端为每一个新的client连接创建一个新的进/线程,当client数量较多时,这种技 ...

  9. canvas实践小实例一 —— 画板工具

    前面讲了一部分的canvasAPI的基础知识,光看API的介绍确实是很无趣乏味,需要一点可以激发内心的激情的东西来激励自己来学习,于是就了伴随canvasAPI学习的小实例,这样通过API的知识,结合 ...

  10. 【JAVA、C++】LeetCode 012 Integer to Roman

    Given an integer, convert it to a roman numeral. Input is guaranteed to be within the range from 1 t ...