1. 创建单个元素节点:3步:
      1. 创建空元素节点对象:
         var elem=document.createElement("标签名");
        比如: var a=document.createElement("a");
          html: <a></a>
      2. 设置新元素的关键属性:
        比如: a.href="http://tmooc.cn";
              a.innerHTML="go to tmooc";
          html: <a href="http://tmooc.cn">go to tmooc</a>
      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的更多相关文章

  1. DOM创建和删除节点、HTML DOM常用对象[转]

    创建和删除节点:——核心DOM   1. 创建单个元素节点:3步:      1. 创建空元素节点对象:         var elem=document.createElement("标 ...

  2. DOM创建和删除节点

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

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

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

  4. jQuery里面的DOM操作(查找,创建,添加,删除节点)

    一:创建元素节点(添加) 创建元素节点并且把节点作为元素的子节点添加到DOM树上 append(): 在元素下添加元素 用法:$("id").append("定义的节点& ...

  5. JS DOM操作(创建、遍历、获取、操作、删除节点)

    创建节点 <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="u ...

  6. Query节点操作,jQuery插入节点,jQuery删除节点,jQuery Dom操作

    一.创建节点 var box = $('<div>节点</div>'); //创建一个节点,或者var box = "<div>节点</div> ...

  7. 节点操作-创建并添加&删除节点&替换&克隆节点

    <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" ...

  8. jQuery节点操作,jQuery插入节点,jQuery删除节点,jQuery Dom操作

    一.创建节点 1 var box = $('<div>节点</div>'); //创建一个节点,或者var box = "<div>节点</div& ...

  9. 使用DOM解析XML文件,、读取xml文件、保存xml、增加节点、修改节点属性、删除节点

    使用的xml文件 <?xml version="1.0" encoding="GB2312" ?> <PhoneInfo> <Br ...

随机推荐

  1. 一个在ASP.NET中利用服务器控件GridView实现数据增删改查的例子

    备注:这是我辅导的一个项目开发组的一个例子,用文章的方式分享出来,给更多的朋友参考.其实我们这几年的项目中,都不怎么使用服务器控件的形式了,而是更多的采用MVC这种开发模式.但是,如果项目的历史背景是 ...

  2. Unity3D 中的三个Update()方法

            MonoBehaviour.Update 更新 当MonoBehaviour启用时,其Update在每一帧被调用. MonoBehaviour.FixedUpdate 固定更新 当Mo ...

  3. Android基于mAppWidget实现手绘地图(十五)–如何控制放大缩小

    一般来说,可以使用以下几种方式来控制地图的放大/缩小 : 1. 使用控件底部的缩放按钮 2.双击控件 3.pinch手势 4.物理按键 :I键标识缩小  :O键表示放大.(只有设备具有物理按键才行) ...

  4. 通过zero copy来实现高效的数据传输

    这段时间在学习一些系统底层的知识,真后悔大学没有好好学习操作系统,导致好多文章看不懂.说到这不得不吐槽一下,像介绍系统层次的一些书籍好多都是中文翻译版,而大部分的中文翻译版大都语句晦涩,难懂,而且极易 ...

  5. SQL Server 存储(5/8):理解IAM 页

    在以前的文章里,我们讨论了数据页,GAM和SGAM,还有PFS页.今天我们一起来讨论下索引分配映射(Index Allocation Map:IAM)页. 在SQL Server 2005和以后的版本 ...

  6. SQL Server安全(7/11):使用跨数据库所有权链接(Cross-Database Ownership Chaining)的跨数据库安全

    在保密你的服务器和数据,防备当前复杂的攻击,SQL Server有你需要的一切.但在你能有效使用这些安全功能前,你需要理解你面对的威胁和一些基本的安全概念.这篇文章提供了基础,因此你可以对SQL Se ...

  7. 关于Razor引擎的语法说明

    1.在页面上显示字符串的值, 格式:a*@变量名 但@之前必须有空格,{.}等,使得a*不可以构成变量的字符.

  8. XML基础学习01

    XML学习 1:XML:可扩展的标识语言,是一种描述结构数据的格式,简化了网络中数据交换和表示,使得代码,数据和表示分离,并作为数据交换的标准格式,被称为智能数据文档. 2:当我们不使用数据库来存储数 ...

  9. 基于C#的MongoDB数据库开发应用(2)--MongoDB数据库的C#开发

    在上篇博客<基于C#的MongoDB数据库开发应用(1)--MongoDB数据库的基础知识和使用>里面,我总结了MongoDB数据库的一些基础信息,并在最后面部分简单介绍了数据库C#驱动的 ...

  10. C++ VS2012 内存泄露检测

    在VS2012中添加部分代码,可以起到检测内存泄露的作用. 今天刚刚收到的解决办法,原理还不是很清楚.先分享出来 1. 头文件中添加以下代码 #ifdef _DEBUG #define DEBUG_C ...