<!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 中标签的增删 方法的更多相关文章

  1. JS获取标签内容的方法

    JS获取标签内容的方法 测试代码 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...

  2. node.js中的url.parse方法使用说明

    node.js中的url.parse方法使用说明:https://blog.csdn.net/swimming_in_it_/article/details/77439975 版权声明:本文为博主原创 ...

  3. JS中 call() 与apply 方法

    1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]]]]) 定义:调用一个对象的一个方法,以另一个对象替换当前对象. 说明: call ...

  4. JS中定义类的方法

    JS中定义类的方式有很多种: 1.工厂方式    function Car(){     var ocar = new Object;     ocar.color = "blue" ...

  5. js中this和回调方法循环-我们到底能走多远系列(35)

    我们到底能走多远系列(35) 扯淡: 13年最后一个月了,你们在13年初的计划实现了吗?还来得及吗? 请加油~ 主题: 最近一直在写js,遇到了几个问题,可能初入门的时候都会遇到吧,总结下. 例子: ...

  6. js中object的申明方法

    //js中的对象申明使用new Object(); //object类型的数据类似于数组通过下表来访问其中的值 //example1 var person=new Object(); person.n ...

  7. JS中令人发指的valueOf方法介绍

    彭老湿近期月报里提到了valueOf方法,兴致来了翻了下ECMA5里关于valueOf方法的介绍,如下: 15.2.4.4 Object.prototype.valueOf ( ) When the ...

  8. js 中读取JSON的方法探讨

    方法一:函数构造定义法返回 var strJSON = "{name:'json name'}";  //得到的JSONvar obj = new Function("r ...

  9. JS中定义类的方法<转>

    转载地址:http://blog.csdn.net/sdlfx/article/details/1842218 PS(个人理解): 1) 类通过prototype定义的成员(方法或属性),是每个类对象 ...

随机推荐

  1. WKWebView 的使用和封装

    WKWebView 的使用和封装 前言 项目中有个新闻资讯模块展示公司和相关行业的最新动态. 这个部分基本是以展示网页为主,内部可能会有一些 native 和 JS 代码的交互. 因为是新项目,所以决 ...

  2. centos7 docker 安装 mysql5.7.24 导入12G的sql

    先在CentOS7里面安装docker Docker 要求 CentOS 系统的内核版本高于 3.10 ,查看本页面的前提条件来验证你的CentOS 版本是否支持 Docker .通过 uname - ...

  3. php 百万级数据文件导出

    背景:最近一个需求是从mysql里面读取数据(有点大),然后导出为csv文件 问题 :发现导出的过程中自己中断了,没有报错 . 第一反应是测试导出一个小一点的数据(少查几条),发现没问题 . 查看导出 ...

  4. SDUT OJ 顺序表应用5:有序顺序表归并

    顺序表应用5:有序顺序表归并 Time Limit: 100 ms Memory Limit: 880 KiB Submit Statistic Discuss Problem Description ...

  5. django中给ajax提交加上csrf

    代码来自djangoproject网站 在html中的script标签下插入下面代码 在html文档加载时候运行下面代码,并且使用$.ajaxSetup设置ajax每次调用时候传入的数据,$.ajax ...

  6. PHP生成pdf文档

    首先需要去github下载tcpdf类库 require_once('./tcpdf/tcpdf.php');         date_default_timezone_get('Asia/Shan ...

  7. 安装jdk1.8,编写环境变量

    好记性不如烂笔头!!!(我这是把jdk放在的/usr/local下,且命令为jdk1.8...复制的时候别搞错位置了) JAVA_HOME=/usr/local/jdk1./ JAVA_BIN=/us ...

  8. Mac下安装配置Python2和Python3并相互切换使用 转

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u014259820/article/details/81023224 安装Python2 Mac系统 ...

  9. C++_类继承6-继承和动态内存分配

    如果基类使用动态内存分配,并重新定义赋值和复制构造函数,这将怎样影响派生类的实现?这个问题的答案取决于派生类的属性.如果派生类也使用动态内存分配,那就需要注意学习新的小技巧. 派生类不适用new // ...

  10. python-使用字典使Fibonacci更有效率

    原代码: def fib(n): if n == 1: return 1 elif n == 2: return 2 else: return fib(n-1)+fib(n-2) 改进后: def f ...