简单实现通过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. c#之Redis实践list，hashtable

    写在前面 最近公司搞了一个活动,用到了redis的队列,就研究了下redis的相关内容.也顺手做了个demo. C#之使用Redis 可以通过Nuget安装Reidis的相关程序集.安装之后发现会引入 ...

  2. （三）Linux命令基本格式以及文件处理命令

    命令基本格式 (1)命令提示符 如下是命令行的命令提示符,以此为例,讲解含义. 其中: root 当前登录用户名 localhost 主机名 ~ 当前所在的目录(即家目录,用户登录的初始位置) # 超 ...

  3. vsftpd的安装

    好像linux下的服务的配置和文件分布都差不多, 如httpd, vsftpd, named. 都是: 在/etc/???下面进行配置???.conf, 然后在/var/???放置实际要处理的文件/目 ...

  4. lnmp常见问题

    常见问题地址:http://lnmp.org/faq.html 如何修改安装LNMP时输入的域名? 修改方法:编辑/usr/local/nginx/conf/nginx.conf 查找安装时输入的域名 ...

  5. web安全防范

    xss漏洞 原理:信任了用户输入或控制的字段(url),回显(jQuery.html)到页面.导致script代码执行 后果:可以在页面执行任何hack代码,比如死循环.发送cookie.钓鱼.页面显 ...

  6. IE下的haslayout特性

    什么是hasLayout?hasLayout是IE特有的一个属性.很多的ie下的css bug都与其息息相关.在ie中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元素来计算尺寸和组织 ...

  7. Toast工具类，Android中不用再每次都写烦人的Toast了

    package com.zhanggeng.contact.tools; /** * Toasttool can make you use Toast more easy ; * * @author ...

  8. basic use of sidekiq

    参考页面 https://github.com/mperham/sidekiq https://github.com/mperham/sidekiq/wiki/Getting-Started 强烈推荐 ...

  9. django 1.7 新特性 --- data migration

    官方文档:https://docs.djangoproject.com/en/dev/topics/migrations/ 1.7 之前大家可能会用south用于管理数据库的模型的同步.1.7之后dj ...

  10. js获取文本框输入的值

    <script type="text/javascript"> function getPosition(obj) { ; if (obj.selectionStart ...