html dom 删除对象,DOM创建和删除节点、HTML DOM常用对象[转]

创建和删除节点：——核心DOM

1. 创建单个元素节点：3步：

1. 创建空元素节点对象：

var elem=document.createElement("标签名");

比如: var a=document.createElement("a");

html:

2. 设置新元素的关键属性：

比如: a.href="http://tmooc.cn";

a.innerHTML="go to tmooc";

html: go to tmooc

3. 将新节点挂到DOM Tree的指定父节点下：3种：

追加：parent.appendChild(elem);

插入：parent.insertBefore(elem,oldElem);

替换：parent.replaceChild(elem.oldElem);

2. 创建多个平级元素节点：3步：

1. 先创建一个文档片段对象：

var frag=document.createDocumentFragment();

文档片段：内存中临时保存一个DOM子树的对象

何时使用：只要添加多个平级节点时，都要先放入文档片段，再将文档片段整体挂到DOM Tree上

2. 将子节点先放入文档片段

3. 将文档片段整体挂到DOM Tree上

文档片段本身不会出现在DOM Tree上，只会将元素加入DOM树

3. 删除：parent.removeChild(子节点);

子节点.parentNode.removeChild(子节点);

2. HTML DOM常用对象：

1. Select对象：

事件：onchange 选中项发生改变时

属性：sel.selectedIndex 获得当前选中项的位置

sel.options 获得sel下所有option元素对象

方法：sel.add(opt) 将opt追加到sel下

sel.remove(i) 删除sel下i位置的option元素

Option对象：

创建一个新option：var opt=new Option(text,value);

相当于核心DOM三句话:

var opt=document.createElement("option");

opt.value=value;

opt.innerHTML=text;

属性：opt.index 获得当前opt所在的位置下标

opt.text  opt.value: 分别获得innerHTML和value

opt.selected: 判断当前opt是否被选中！

强调：opt的selected不是bool值！

但是却可直接作为条件判断

创建option同时，追加到select中：

sel.add(new Option(text,value));

DOM创建和删除节点

一.创建节点 3步 1.创建空元素对象: var newElem=document.createElement("标签名"); 例如:var a=document.createEl ...

创建和删除节点：——核心DOM

1. 创建单个元素节点:3步:       1. 创建空元素节点对象:          var elem=document.createElement("标签名");      ...

jQuery08源码 (5140 , 6057) DOM操作 : 添加 删除 获取 包装 DOM筛选

jQuery.fn.extend({ //$('ul').find('li').css('background','red'); //$('ul').find( $('li') ).css('back ...

jquery17 DOM操作 : 添加 删除 获取 包装 DOM筛选

DOM 创建元素 删除元素(结点)

创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素.

jquery16 DOM操作 : 添加 删除 获取 包装 DOM筛选

PHP中利用DOM创建xml文档

DOM创建xml文档 用dom创建如下文档: 天龙八部&gt ...

react系列一，react虚拟dom如何转成真实的dom

react,想必作为前端开发一定不陌生,组件化以及虚拟dom使得react成为最受欢迎额前端框架之一.我们知道react是基于虚拟dom的,但是什么是虚拟dom呢,其实就是一组js对象,那么我们今天就 ...

jQuery – 7.动态创建Dom、删除节点

动态创建Dom节点     1.使用$(html字符串)来创建Dom节点     2.append方法用来在元素的末尾追加元素     案例:动态生成网站列表     3.prepend,在元素的开始 ...

随机推荐

IIS减少工作线程阻塞的方法

IIS的工作进程(w3wp.exe)只提供了有限的工作线程(Work Thread)来处理请求.如果这些线程都因为要等待长时间运行的任务而阻塞,则运行时会将新来的请求排队,而不是立即执行,Web服务器 ...

sqlserver 存储过程 try catch TRANSACTION (转)

CREATE PROCEDURE YourProcedure    ASBEGIN    SET NOCOUNT ON; BEGIN TRY---------------------开始捕捉异常    ...

[ArcGIS所需的补丁]ArcGIS 10.2.2 for Desktop联系Oracle(2014年10上个月发布)数据库崩溃

环境的叙述性说明: ArcGIS 10.2.2 for Desktop.Oracle12.1.0.2 RAC 这仅仅是用户当时环境描写叙述.可是导致该问题的解决办法还包含很多其它的环境! 问题描写叙述 ...

WPF中动态更新TextBlock文字中的超链接，文本

1.------------------------------------------------------------------------- 修改超链接的文本文字:

c# 处理空白字符，空白字符是指在屏幕不会显示出来的字符

空白字符是指在屏幕不会显示出来的字符(如空格,制表符tab,回车换行等).空格.制表符.换行符.回车.换页垂直制表符和换行符称为 "空白字符",因为它们为与间距单词和行在打印的页 ...

[ExtJS5学习笔记]第二十一节 Extjs5中使用config配置给ext.widget或者create方法传递参数

本文地址:http://blog.csdn.net/sushengmiyan/article/details/39252805 官方例子:http://docs.sencha.com/extjs/5. ...

关于PHP处理Json数据的例子

最近工作需要在原来静态看板(大屏)页面的基础上,实现数据的动态展示,而且需要定时刷新. 接到任务后就马不停蹄的开始修改页面: 显然这个需求最好的解决方法就是用Ajax对后台数据进行定时请求,在前端页面 ...

DataRow[]

datarow[]是datatable 的行数组集合,但是呢好像是不能直接初始化,只能是datarow[] rows = dt.select(condition);这样子.(也可能我才疏学浅没找到吧) ...

后台自动运行，定期记录定位数据(Hbuilder监听 app由前台切换到后台、切换运行环境的 监听方法)

http://ask.dcloud.net.cn/question/28090 https://blog.csdn.net/qq_37508970/article/details/86649703 各 ...