JavaScript基础1——在末尾添加节点
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>在末尾添加节点</title>
</head>
<body>
<ul>
<li>111</li>
<li>222</li>
<li>333</li>
<li>444</li>
</ul>
<br>
<input type="button" value="添加节点" onclick="addNode()" />
<script type="text/javascript">
function addNode() {
// 获取到ul
var ul = document.getElementsByTagName("ul")[0];
// 创建li
var li = document.createElement("li");
// 创建文本
var length = ul.children.length + 1;
var text = document.createTextNode(length + "" + length + "" + length);
// 在li中加入文本
li.appendChild(text);
// 在ul中加入li
ul.appendChild(li);
}
</script>
</body>
</html>
JavaScript基础1——在末尾添加节点的更多相关文章
- JavaScript案例二：在末尾添加节点
简单实现通过JavaScript来增加HTML节点 <!DOCTYPE html> <html> <head> <title>JavaScript在末尾 ...
- js实现在末尾添加节点
在末尾添加节点: 1.获取ul标签 2.创建li标签 document.createElement("标签名称")方法 3.创建文本 document.createTextNode ...
- Javaweb学习笔记——（四）——————JavaScript基础&DOM目录
1.案例一:在末尾添加节点 第一个:获取到ul标签 第二部:创建li标签 document.createElement("标签名称")方法 第三步:创建文本 document.cr ...
- JavaScript实验一(添加节点，删除节点)
静态html页面: <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...
- jQuery基础--创建节点和 添加节点
创建节点 $(function () { // var box = document.getElementById("box"); // // var a = document.c ...
- javascript基础部分
javascript基础部分 1 数据类型: 基础数据类型(通过typeof来检测):Number,string,undefined,null,boolean,function typeof只能检测 ...
- javascript 基础教程[温故而知新一]
子曰:“温故而知新,可以为师矣.”孔子说:“温习旧知识从而得知新的理解与体会,凭借这一点就可以成为老师了.“ 尤其是咱们搞程序的人,不管是不是全栈工程师,都是集十八般武艺于一身.不过有时候有些知识如果 ...
- JavaScript学习(1)之JavaScript基础
JavaScript学习(1)之JavaScript基础 由于工作原因,开发语言逐渐以JavaScript为主,所以,抽空学习了下JavaScript语法.等现阶段的工作稳定之后,陆续会分享下自己在学 ...
- python web开发学习笔记一：javascript基础
一.认识js: 能进入到软件所实习是我的最大的收获,也是我的荣幸,我相信努力付出一定能够换回收获. 项目最先开始的是接触到web前端的一些内容,我们需要利用flask搭建应该有的框架.我有一些pyth ...
随机推荐
- asp.net (web)选择文件夹 上传文件
1 背景 用户本地有一份txt或者csv文件,无论是从业务数据库导出.还是其他途径获取,当需要使用蚂蚁的大数据分析工具进行数据加工.挖掘和共创应用的时候,首先要将本地文件上传至ODPS,普通的小文件通 ...
- CodeForces 1198C 1199E Matching vs Independent Set
Time limit 1000 ms Memory limit 262144 kB 这题是一场cf里,div1的第三题,div2的第5题 中文题意 给一张无向图,没说连通性,要你选出一个大小为n的匹配 ...
- iOS开发自定义字体之静态字体
最后更新 2017-04-25 在iOS开发中经常会用到字体, 一般字体文件比较小的,单一的,几十k, 可以通过内置进去;如果字体文件比较多或者字体文件比较大,通常通过动态加载方式. 静态加载方式 将 ...
- 前端学习记录 week 1
前端学习记录 week 1 基础知识 CSS盒模型 所有HTML元素可以看作盒子,在CSS中,"box model"这一术语是用来设计和布局时使用.CSS盒模型本质上是一个盒子,封 ...
- canvas 方块旋转案例
<!doctype html><html><head> <meta charset="UTF-8"> <meta name=& ...
- 玩转visual studio系列之类设计图
类设计图 vs 类设计图 微软 安装好vs2017后,在打开的IDE中,随便选择一个文件夹创建[类图],却发现没有该选项 类图辅助器 解决方案 1.点击[工具]选项卡,在下拉的菜单中选择第一项 获取 ...
- vue 拖动调整左右两侧div的宽度
原文链接:https://www.cnblogs.com/layaling/p/11009570.html 原文是左中右三种情况的拖动.由于项目需要,我删除掉了右边的,直接左右区域拖动调整div宽度 ...
- Linux内核调试方法总结之coredump
什么是core dump? 分析core dump是Linux应用程序调试的一种有效方式,像内核调试抓取ram dump一样,core dump主要是获取应用程序崩溃时的现场信息,如程序运行时的内存. ...
- python安装使用（windows）
安装 参考:http://scrapy-chs.readthedocs.io/zh_CN/0.24/intro/install.html#scrapy 用到的文件:https://share.weiy ...
- Vue知识整理4：v-html标签
可以在数据绑定中使用html标签,这样在变量里可以使用html标签输出结果,如下所示: