简单实现通过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. 百科编辑器ueditor应用笔记

    最近项目上要用到文本编辑器,选了百科开源的ueditor,使用过程中虽然有些问题,但是一个个都解决了,记录如下: 开发的项目环境是vs2012:.net4.0: 1:百度js编辑器,编辑器加载到项目中 ...

  2. ios数据库

    1. ios数据库管理软件 ios使用的数据库是sqlite 管理软件有2种, 我只记得一种, 名字叫做 MesaSQLite 2. sqlite数据库 2.1.修改表结构 ①:更改字段类型长度 AL ...

  3. MYSQL注入天书之HTTP头部介绍

    Background-5 HTTP头部介绍 在利用抓包工具进行抓包的时候,我们能看到很多的项,下面详细讲解每一项. HTTP头部详解 1. Accept:告诉WEB服务器自己接受什么介质类型,*/* ...

  4. 一次手工注入waf [转载]

    转载自sss安全论坛 目标站点:http://www.xxx.cn:88注入点:http://www.xxx.cn:88/new/details1.asp?n_id=49909对其进行检测:http: ...

  5. Android5.0版本之后切换听筒模式

    5.0以前Android听筒模式和扬声器模式这样就管用 扬声器://关闭麦克风  mAudioManager.setMicrophoneMute(false);  // 打开扬声器  mAudioMa ...

  6. Master-Worker模式

    并行程序设计模式--Master-Worker模式 简介 Master-Worker模式是常用的并行设计模式.它的核心思想是,系统有两个进程协议工作:Master进程和Worker进程.Master进 ...

  7. 关于Xcode6 Segue 的疑问，没有解决！

    xcode6 的segue 变化了,如图 关于前3个选项,始终没有太明白,我试验结果如下,简单地把几个viewController连接起来时,无论用show,还是showdetail,还是Presen ...

  8. 【JAVA、C++】LeetCode 003 Longest Substring Without Repeating Characters

    Given a string, find the length of the longest substring without repeating characters. For example, ...

  9. java 执行command

    StringBuffer buf = new StringBuffer(1000); try { Process pos = Runtime.getRuntime().exec("sh &q ...

  10. jsp url传值乱码

    <Connector port="8080" maxHttpHeaderSize="8192" minProcessors="10"  ...