js appendChild与insertBefore 区别和用法
<input type="button" value="增加" id="btn" />
<ul id="ul">
<li>第一个</li>
<li>第二个</li>
</ul>
JS 代码:
my$("btn").onclick = function () {
//创建一个元素标签
var li = document.createElement('li');
//给元素设置内容
li.innerText = ('新增一个内容');
// 在父元素的后面添加
my$('ul').appendChild(li);
} my$("btn").onclick = function () {
//创建一个元素标签
var li = document.createElement('li');
//给元素设置内容
li.innerText = ('新增一个内容');
// setInnnerText(li,'增加的');
my$('ul').insertBefore(li, my$('ul').lastElementChild);
//第一个参数 添加的内容 第二个参数是在那个位置前面 添加
}
js appendChild与insertBefore 区别和用法的更多相关文章
- js中!和!!的区别及用法
js中!的用法是比较灵活的,它除了做逻辑运算常常会用!做类型判断,可以用!与上对象来求得一个布尔值,1.!可将变量转换成boolean类型,null.undefined和空字符串取反都为false,其 ...
- js 各种循环的区别与用法(for in,forEach,for of)
1,forEach循环 不能跳过或者终止循环 const a = ["a","ss","cc"] a.dd="11" ...
- js便签笔记(3)——切记:appendChild()、insertBefore()是移动element节点!
appendChild().insertBefore()是移动element节点,看书的时候注意过,也可以做一个简单的例子测试一下: <div id="div1"> & ...
- js插入节点appendChild和insertBefore
首先 从定义来理解 这两个方法: appendChild() 方法:可向节点的子节点列表的末尾添加新的子节点.语法:appendChild(newchild) insertBefore() 方法:可在 ...
- JS(JavaScript)插入节点的方法appendChild与insertBefore
首先 从定义来理解 这两个方法: appendChild() 方法:可向节点的子节点列表的末尾添加新的子节点.语法:appendChild(newchild) insertBefore() 方法:可在 ...
- appendChild append insertBefore prepend
CreateTime--2017年11月2日16:57:59 Author:Marydon appendChild()与append() insertBefore()与prepend()区别与联系 ...
- angularjs中provider,factory,service的区别和用法
angularjs中provider,factory,service的区别和用法 都能提供service,但是又有差别 service 第一次被注入时实例化,只实例化一次,整个应用的生命周期中是个单例 ...
- (转)appendChild()、insertBefore()是移动element节点!
原文地址 appendChild().insertBefore()是移动element节点,看书的时候注意过,也可以做一个简单的例子测试一下: <div id="div1"& ...
- IE和firefox火狐在JS、css兼容区别
1.firefox不能对innerText支持. firefox支持innerHTML但却不支持innerText,它支持textContent来实现innerText,不过默认把多余的空格也保留了. ...
随机推荐
- linux 修改openfiles
使用ulimit -a 可以查看当前系统的所有限制值,使用ulimit -n 可以查看当前的最大打开文件数. 新装的linux默认只有1024,当作负载较大的服务器时,很容易遇到error: too ...
- Bootstrap教程目录
1.Bootstrap 简介(Web前端CSS框架) 2.Bootstrap 学习资料 3.Bootstrap 入门 4.Bootstrap 概览 5.Bootstrap 栅格系统 6.Bootstr ...
- Oracle 中 over() 函数
:first-child { margin-top: 0; } blockquote > :last-child { margin-bottom: 0; } img { border: 0; m ...
- 转-使用wifi调试程序
转自:http://www.cnblogs.com/sunzhenxing19860608/archive/2011/07/14/2106492.html 数据线丢了,不想花钱去买,在网上看了看,an ...
- 面试题:SpringMVC的工作流程
SpringMVC是当今最主流的Web MVC框架,没有之一,要做一名合格的JavaWeb工程师,学好它势在必行! 与Struts2原理不同,SpringMVC是通过最基础最传统的servlet来实现 ...
- Installing R under Unix-alikes
Linux上R的安装 可参考https://cran.r-project.org/doc/manuals/r-release/R-admin.html#Installing-R-under-Unix_ ...
- KMP算法细讲(豁然开朗)
一.KMP算法是如何针对传统算法修改的 用模式串P去匹配字符串S,在i=6,j=4时发生失配: ---------------------------------------------------- ...
- Mybaties核心配置文件
<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE configurationPUBLIC &q ...
- Date3.19
1.正则表达式的定义及使用2.Date类的用法3.Calendar类的用法========================================================1正则表达式的 ...
- Linux下为Eclipse安装hadoop插件
前提条件:在Linux系统中已经安装好了jdk和hadoop 本文的安装环境:1.arch Linux 2. hadoop1.0.1本地伪分布模式安装 3. Eclipse 4.5 1. 下载Ecl ...