DOM基础操作(二)
插入操作
1.appendChild(child);
这个是父级调用的方法,它会将child元素插入到父级里面,而且是放到逻辑后面的位置上。
div.appendChild(text); div.appendChild(comment);
这样div里面就会有一行文本一行注释。
这里如果是我们创建的元素,那么appendChild就是把新元素插入进去,但是如果是DOM里面已经存在的元素,那么appendChild就是把这个已经存在的元素给剪切掉,然后放到新的位置上。
2.insertBefore(a, b);
这个依然是父节点调用的方法,它的意思是将a插入到b前面的位置上,其中b要求是这个父级的子节点。这个方法可以记作为 insert a before b;
var span = document.createElement(‘span’); div.insertBefore(span, comment);
这样我们就把一个span元素插入到了刚才的注释文本前面。
DOM基础操作(二)的更多相关文章
- JavaScript DOM 基础操作
JavaScript DOM 基础操作 一.获取元素的六方式 document.getElementById('id名称') //根据id名称获取 document.getElementsByclas ...
- DOM基础(二)
在我之前写的DOM基础(一)的文章中提到过兼容性的问题,也就是在获取标签间文本信息的时候,早期的火狐版本是不支持innerText的,只支持textContent ,现在的火狐浏览器两者都支持.而IE ...
- javascript DOM基础操作
DOM(Document Object Model)即文档对象模型,针对HTML和XML文档的API(应用程序接口).DOM描绘了一个层次化的节点树,运行开发人员添加.移除和修改页面的某一部分.DOM ...
- Dom基础(二):Dom性能优化
一.尽量将DOM查询做缓存 1 let pElements = document.getElementById('div1') //将dom缓存 2 3 for(let i=0:i<pEleme ...
- Linux基础操作二
编程语言的作用及与操作系统和硬件的关系 编程语言的作用:用来定义计算机程序的形式,程序员用它来编写程序,进而控制其向计算机发出指令,使计算机完成人类布置的任务. 编程语言的作用及与操作系统和硬件的关系 ...
- JavaScript学习 - 基础(六) - DOM基础操作
DOM: DOM定义了访问HTML 和XML 文档的标准:1.核心DOM 针对结构化文档的标准模型2.XMK DOM 针对XML文档的标准模型3.HTML DOM 针对HTML文档的标准模型 DOM节 ...
- jQuery~DOM基础操作
操作DOM 1.什么是DOM:document object model文档对象模型 2.树形结构 3.什么是节点(node):DOM结构中最小单位,元素.文本.属性...创建节点 var $div ...
- DOM基础操作实战代码
对于已经讲解给大家的DOM实战,我今天给大家几个实战代码,可以让大家加深对此的理解! 1.用DOM动态生成这样一个结构: <div class=”example”> <p class ...
- DOM基础操作(三)
DOM剩余的两个操作一并带来! 1.删除操作 removeChild 这个方法依然是父级调用的,参数就是要删除的子节点,其实实际上是剪切,这个方法会把我们删除掉的元素给返回,我们可以用一个变量去保存这 ...
随机推荐
- Rabbitmq 消息对列 生产者与消费者的具体实现 springboot
RabbitMQ 基本介绍 RabbitMQ的设计理念是.只要有接收消息的队列. 邮件就会存放到队列里. 直到订阅人取走. . 如果没有可以接收这个消息的消息队列. 默认是抛弃这个消息的.. 我实现的 ...
- python 之 比较哪个数据大小
#定义一个字典info={}#定义比较的人数n=int(input("请输入你要比较的人数"))#循环while(n): #输入a,b 两个数据 ,分别代表学号 和分数 # 把输入 ...
- [转]CocoaPods安装和使用教程
[转载自:http://code4app.com/article/cocoapods-install-usage] 目录 CocoaPods是什么? 如何下载和安装CocoaPods? 如何使用Coc ...
- C#-WebForm-AJAX阿贾克斯(一)基础知识
AJAX 即“ Asynchronous Javascript And XML ”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. AJAX = 异步 JavaScri ...
- C#-一维数组——★★冒泡排序★★
////★★★★★冒泡排序 ; i < a - ; i++) { ; j < a; j++) { if (age[i] < age[j]) { int zhong = age[i]; ...
- Eclipse 的SVN 的分支
分支 概念 在版本控制过程中,使用多个分支同时推进多个不同功能开发. 不使用分支开发:人与人之间协作 使用分支开发:小组和小组之间协作 作用 多个功能开发齐头并进同时进行 任何一个分支上功能 ...
- python学习,day4:装饰器的使用示例
---恢复内容开始--- 装饰器:本质是函数,(装饰其他函数)就是为其他函数添加附加功能 装饰器有其独特的原则:1.不能修改被装饰的函数的源代码 2.不能修改被装饰的函数的调用方式 例子 import ...
- maven工程下testng简单使用
创建maven工程后,将Repository仓库中maven代码粘贴复制到pom.xml文件中,仓库地址:<!-- https://mvnrepository.com/artifact/org. ...
- [Xamarin.Android]使用Java Bindings Libary專案 Binding Java元件(.jar) 與Metadata.xml、型別對應 (转帖)
使用Xamarin開發Android APP時, 如果已經有原本就用Java寫好的套件(.jar), 就可以利用Xamarin提供的Java Bindings Libary將他變成C#可使用的元件. ...
- Windows里下载并安装phpstudy(图文详解)
不多说,直接上干货! 帮助站长快速搭建网站服务器平台! phpstudy软件简介 此是基于phpStudy 2016.01.01. 该程序包集成最新的Apache+Nginx+LightTPD+PHP ...