js 中标签的增删 方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#div1{
height:800px;
width: auto;
background-color: #204982;
font-size: 20px;
}
</style>
</head>
<body>
<div id="div1">
<div id="div2">hello div</div>
<p id="p">hello p</p>
</div>
<input type="button" value="增加" onclick="func1()">
<input type="button" value="删除" onclick="func2()"> <script> function func1() {
var ele=document.getElementById("div1"); //增加必须找到要增加标签的父级标签
var add_son=document.createElement("p"); // 这是一个创建P标签的方法
ele.appendChild(add_son); // 这是给父级标签添加一个孩子
add_son.innerHTML="<b>添加成功!</b>" // 给新添加的子标签 加上文本 也可以加上标签,引号内对于innerHTML来说都是字符串
}
function func2() {
var ele=document.getElementById("div1"); //删除与增加一样,同样要找到父级标签
var del_son=ele.lastElementChild; // 指明要删除的标签在最后的位置(last)
ele.removeChild(del_son); // remove方法删除父级下的子标签
}
</script>
</body>
</html>
js 中标签的增删 方法的更多相关文章
- JS获取标签内容的方法
JS获取标签内容的方法 测试代码 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- node.js中的url.parse方法使用说明
node.js中的url.parse方法使用说明:https://blog.csdn.net/swimming_in_it_/article/details/77439975 版权声明:本文为博主原创 ...
- JS中 call() 与apply 方法
1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call ...
- JS中定义类的方法
JS中定义类的方式有很多种: 1.工厂方式 function Car(){ var ocar = new Object; ocar.color = "blue" ...
- js中this和回调方法循环-我们到底能走多远系列(35)
我们到底能走多远系列(35) 扯淡: 13年最后一个月了,你们在13年初的计划实现了吗?还来得及吗? 请加油~ 主题: 最近一直在写js,遇到了几个问题,可能初入门的时候都会遇到吧,总结下. 例子: ...
- js中object的申明方法
//js中的对象申明使用new Object(); //object类型的数据类似于数组通过下表来访问其中的值 //example1 var person=new Object(); person.n ...
- JS中令人发指的valueOf方法介绍
彭老湿近期月报里提到了valueOf方法,兴致来了翻了下ECMA5里关于valueOf方法的介绍,如下: 15.2.4.4 Object.prototype.valueOf ( ) When the ...
- js 中读取JSON的方法探讨
方法一:函数构造定义法返回 var strJSON = "{name:'json name'}"; //得到的JSONvar obj = new Function("r ...
- JS中定义类的方法<转>
转载地址:http://blog.csdn.net/sdlfx/article/details/1842218 PS(个人理解): 1) 类通过prototype定义的成员(方法或属性),是每个类对象 ...
随机推荐
- BumpMap、NormalMap的区别
原文:http://linuxtest.blog.163.com/blog/static/199927088201275102145354/ 一种是Emboss Bump Map(浮雕凹凸贴图), ...
- Timer(定时器)
默认情况下,在每个采样器之前没有任何延时,这样不能很好的模拟现实生活中人们访问网页,因为现实生活中人们点击一个请求后,会有一定的时间,然后再点击下一个请求,JMeter提供了定时器来模拟这种行为. 定 ...
- rtabmap and rtabmap_ros make error(rtabmap编译错误)
Build from source following README.nd in rtabmap_ros rtabmap make error Error 1 make[2]: *** No rule ...
- oracle为IN OUT变量或OUT变量赋值时提示“表达式''不能用作赋值目标”
是因为IN OUT变量和OUT变量是要输出的,不能赋给它常量值,这样它就不能再被赋值而输出了,所以是禁止赋常量值的,比如''也是常量值,也不可以赋给这两种类型的变量,如果不能把存储过程中的其他变量赋给 ...
- 特殊用途语言特性(默认实参/内联函数/constexpr函数/assert预处理宏/NDEBUG预处理变量)
默认实参: 某些函数有这样一种形参,在函数的很多次调用中它们都被赋予一个相同的值,此时,我们把这个反复出现的值称为函数的默认实参.调用含有默认实参的函数时,可以包含该实参,也可以省略该实参. 需要特别 ...
- loj #2051. 「HNOI2016」序列
#2051. 「HNOI2016」序列 题目描述 给定长度为 n nn 的序列:a1,a2,⋯,an a_1, a_2, \cdots , a_na1,a2,⋯,an,记为 a[1: ...
- C# 委托的三种调用示例(同步调用、异步调用、异步回调)
首先,通过代码定义一个委托和下面三个示例将要调用的方法: 代码如下: public delegate int AddHandler(int a,int b); public class 加法类 { p ...
- 使用C#实现SSLSocket加密通讯 Https
原文链接 http://blog.csdn.net/wuyb_2004/article/details/51393290 using System; using System.Collections; ...
- js事件处理程序return false ,preventDefault,returnValue
面试题目中,经常会被问到如何阻止默认行为. 以下是<javascript权威指南>书中的内容,详情可以去看书. 能够取消事件默认操作的方法有三种 1.属性注册的事件处理程序的返回值fals ...
- js时间对比-转化为几天前,几小时前,几分钟前
function getDateDiff(dateTimeStamp){ var minute = 1000 * 60; var hour = minute * 60; var day = hour ...