HTML DOM的创建,删除及替换
创建HTML元素
document.appendChild()
将新元素作为父元素的最后一个子元素进行添加
如需向HTML DOM添加新元素,首先必须创建该元素,然后把它追加到已有的元素上
var newElement = document.createElement("p") //创建新元素p
var newTextNode = document.createTextNode("文本节点") //创建新文本节点
newElement.appendChild(newTextNode) //向 <p> 元素追加文本节点
var element = document.getElementById("div_id")
element.appendChild(newElement)
document.insertBefore()
该方法可以在指定位置创建新元素
var newElement=document.createElement("p");
var newTextNode=document.createTextNode("文本节点");
newElement.appendChild(newTextNode);
var element=document.getElementById("div_id");
var child=document.getElementById("p1");
element.insertBefore(newElement,child); //将newElement插入到child节点前
删除HTML元素
document.removeChild()
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
/*
要想删除一个元素必须要通过父元素调用removeChild()方法实现
如果确定删除的元素但不确定父元素,可通过以下方式实现
即通过parentNode属性获取父元素,然后再调用removeChild()方法实现
var child=document.getElementById("p1");
child.parentNode.removeChild(child);
*/
替换HTML元素
document.replaceChild()
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
var para=document.createElement("p");
var node=document.createTextNode("这是一个新的段落。");
para.appendChild(node);
parent.replaceChild(para,child);
HTML DOM的创建,删除及替换的更多相关文章
- Javascript:DOM动态创建元素实例应用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Dom 获取、Dom动态创建节点
一.Dom获取 1.全称:Document Object Model 文档对象模型 2.我们常用的节点类型 元素(标签)节点.文本节点.属性节点(也就是标签里的属性). 3.docum ...
- Android零基础入门第87节:Fragment添加、删除、替换
前面一起学习了Fragment的创建和加载,以及其生命周期方法,那么接下来进一步来学习Fragment的具体使用,本期先来学习Fragment添加.删除.替换. 一.概述 在前面的学习中,特别是动态加 ...
- 二叉排序树(BST)创建,删除,查找操作
binary search tree,中文翻译为二叉搜索树.二叉查找树或者二叉排序树.简称为BST 一:二叉搜索树的定义 他的定义与树的定义是类似的,也是一个递归的定义: 1.要么是一棵空树 2.如果 ...
- JS截取,删除,替换字符串常用方法详细
删除和替换是一样的,开始用的是,如果是删除就直接替换为空 arr="abc001abc002abc003" arr.replace('abc','123') 结果发现只能替换第一个 ...
- JavaScript DOM动态创建(声明)Object元素
http://www.cnblogs.com/GuominQiu/archive/2011/04/01/2002783.html 一文提及“等整个页面加载完毕后,根据用户所选的阅读机类型,再用Java ...
- android使用mount挂载/system/app为读写权限,删除或替换系统应用
注意:以下代码中#开头的则为需要执行的shell命令,其他的为打印的结果.#代表需要使用ROOT权限(su)执行,所以想要修改您android手机某个目录挂载为读写,首先需要有ROOT权限! 先要得到 ...
- 在后台对GameObject进行"创建"||"删除"动作
在后台对GameObject进行"创建"||"删除"动作 建立 public GameObject Pre;//在编辑器中用来绑定的Prefabs public ...
- Javascript:splice()方法实现对数组元素的插入、删除、替换及去重
定义和用法 splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目. 注释:该方法会改变原始数组. 语法: Array.prototype.splice(index,count[,el ...
- Swift字符串的插入、删除和替换-备
对应可变字符串可以插入.删除和替换,String提供了几个方法可以帮助实现这些操作.这些方法如下: splice(_:atIndex:).在索引位置插入字符串. insert(_:atIndex:). ...
随机推荐
- mysql 中文不显示问题
MySQL的字符集支持(Character Set Support)有两个方面: 字符集(Character set)和排序方式(Collation).对于字符集的支持细化到四个层次: 服务器(ser ...
- 重启testjenkins的步骤
在linux下编译caffe的过程中,发生错误,导致linux系统蹦了,没办法,重启linux系统. 之前安装在docker下的jenkins也停掉了. 先启动jenkins的步骤如下: 1.先启动d ...
- js对象可扩展性和属性的四个特性(上)
# js对象可扩展性和属性的四个特性(上) 一.前言 再次花时间回顾一下基础,毕竟要想楼建的好,地基就要牢固,嘻嘻! 在开始之前需要具备对prototype.__proto__.constructor ...
- uni-app之网络请求
uni-app之网络请求 一,介绍 uni.request(OBJECT),发起网络请求,以下主要是一些特殊的参数说明,详细的可查看uni-app官网. 1,method的有效值必须是大写,默认GET ...
- 分享一个Vue数组赋值的错误
今天在写项目用到Vue的时候,遇到的一个问题,纠结了好一会,首先我的代码是这样的 有没有毛病!! 开始我感觉是没啥毛病啊,按照之前写Java代码的逻辑,我感觉这没一点毛病 . 但是它就是有毛病, 假 ...
- 使用Carthage集成Alamofire
Carthage相较于Cocoapods有着使用灵活,对目标工程改动小的优势,使得它越来越受欢迎.今天就对我使用Carthage集成FBSDK做一个记录. 1.首先https://github.com ...
- 学习go语言第二天-变量、常量
编写测试程序 源码文件以_test结尾;例如:xxx_test.go 测试方法名以Test开头;例如:func TestXXXXX(t *testing.T){} 实现斐波那且数列 package f ...
- OSC2019关于开源的见闻-开源让世界更美好 社会更文明
一.开源生态报告-红薯-开源中国创始人 1.协作乏力-大厂同样 2.协议许可证使用不当 新许可证-木兰 3.开发者对法律认识完全不够 著作权意识不够 红线意识不够 相关法律法规的熟悉不够 维权及其弱势 ...
- Orleans 序列化遇到的坑
真的是巨坑 搞明白问题的我简直无法用言语来描述我的心情 先上架构图 理想中的架构 服务随便上 网关只负责分发 然后跟随官方教程写遇到了序列化问题 以前有经验,不慌,以前稀里糊涂就搞定了. 再然后遇到一 ...
- 【H5】344- 微信 H5 页面兼容性解决方案
点击上方"前端自习课"关注,学习起来~ 最近给公司微信公众号,写了微信h5业务页面,总结分享一下前端开发过程中的几个兼容性坑,项目直接拿的公司页面,所以下文涉及图片都模糊处理了. ...