<!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——在末尾添加节点的更多相关文章

  1. JavaScript案例二：在末尾添加节点

    简单实现通过JavaScript来增加HTML节点 <!DOCTYPE html> <html> <head> <title>JavaScript在末尾 ...

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

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

  3. Javaweb学习笔记——（四）——————JavaScript基础&DOM目录

    1.案例一:在末尾添加节点 第一个:获取到ul标签 第二部:创建li标签 document.createElement("标签名称")方法 第三步:创建文本 document.cr ...

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

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

  5. jQuery基础--创建节点和 添加节点

    创建节点 $(function () { // var box = document.getElementById("box"); // // var a = document.c ...

  6. javascript基础部分

    javascript基础部分 1  数据类型: 基础数据类型(通过typeof来检测):Number,string,undefined,null,boolean,function typeof只能检测 ...

  7. javascript 基础教程[温故而知新一]

    子曰:“温故而知新,可以为师矣.”孔子说:“温习旧知识从而得知新的理解与体会,凭借这一点就可以成为老师了.“ 尤其是咱们搞程序的人,不管是不是全栈工程师,都是集十八般武艺于一身.不过有时候有些知识如果 ...

  8. JavaScript学习(1)之JavaScript基础

    JavaScript学习(1)之JavaScript基础 由于工作原因,开发语言逐渐以JavaScript为主,所以,抽空学习了下JavaScript语法.等现阶段的工作稳定之后,陆续会分享下自己在学 ...

  9. python web开发学习笔记一：javascript基础

    一.认识js: 能进入到软件所实习是我的最大的收获,也是我的荣幸,我相信努力付出一定能够换回收获. 项目最先开始的是接触到web前端的一些内容,我们需要利用flask搭建应该有的框架.我有一些pyth ...

随机推荐

  1. 华为云服务器centos7.3 安装jdk

    1. 进入oracle官网 https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 服 ...

  2. linux运维、架构之路-git版本管理

    一.常见版本管理系统 1.SVN     集中式的版本控制系统,只有一个中央数据仓库,如果中央数据仓库挂了或者不能访问,所有的使用者无法使用svn,无法进行提交或者备份文件 2.Git      分布 ...

  3. getCurrentPages

    解释:getCurrentPages 全局函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面. 示例: // index.jsPage({ onShow( ...

  4. layer.confirm

    layer.confirm('确定不选择花车?', { title: false, btn: ['确定','取消'] //按钮 }, function(ind){ layer.close(ind); ...

  5. es之过滤器

    我们已经介绍了如何使用不同的条件查询来构建查询并搜索数据.我们还熟知了评分,它告诉我们在给定的查询中,哪些文档更重要以及查询文本如何影响排序.然而,有时我们可能要在不影响最后分数的情况下,选择索引中的 ...

  6. 阿里云万网虚拟主机安装配置Https（SSL）教程

    太多太多的用户咨询阿里云虚拟主机是否可以安装SSL数字证书?万网空间是否可以支持HTTPS协议访问网站?答案只有一个:目前阿里云虚拟主机都不支持安装SSL证书!但是,但是,可以曲线实现目标! 1.为了 ...

  7. 获取项目配置的常用方法(Struts/Servlet)

    struts: //web.xml中: <context-param> <param-name>paramName</param-name> <param-v ...

  8. (转)VS2010结合水晶报表做条码标签打印功能

    本文转载自:http://blog.sina.com.cn/s/blog_552ca1400100y6dd.html 先来个功能效果图: 大家都知道VS2005和VS2008软件本身是包含水晶报表插件 ...

  9. jenkins打包ios 报错rror: No signing certificate "iOS Distribution" found: No "iOS Distribution...

    错误提示如图: error: No signing certificate "iOS Distribution" found: No "iOS Distribution& ...

  10. 错误 error: The following untracked working tree files would be overwritten by merge:README.md

    问题类型 相信很多小伙伴在创建新的git仓库后,会选上添加README.md文件,开始我也没太在意,应该也没有什么问题. 但是当我通过git添加远程仓库,给这个仓库上传代码时,出现了如下问题:erro ...