1.创建子元素oLi=document.creatElement('li')

2.将元素附给父级元素oUl.appendChild(oLi)

3.将元素插入到父级元素里的第一位子元素之前oUl.insertBefore(oLi,aLi[0])

if(aLi.length>0)用这个,反之else用oUl.appendChild(oLi),否则会出错

4.oUl.removeChild(this.parentNode)       //删除的子节点为当前事件的父节点

5.文档碎片应用,相当于购物袋

var oFrag=document.creatDocumentFragment();

oFrag.appendChild(oLi);

oUl.appendChild(oFrag);

12 DOM操作应用的更多相关文章

  1. 12 DOM操作的相关案例

    1.模态框案例 需求: 打开网页时有一个普通的按钮,点击当前按钮显示一个背景图,中心并弹出一个弹出框,点击X的时候会关闭当前的模态框 代码如下: <!DOCTYPE html> <h ...

  2. 摆脱DOM操作,从TodoMVC看angularJS

    取代jQuery? 我很久之前便听说了angularJS的大名,之前的leader也经常感叹angularJS的设计如何如何精妙,可叹一直没有机会深入了解,国庆长假因为没钱出游,倒是可以对他做一个了解 ...

  3. jQuery学习笔记(二)jQuery中DOM操作

    目录 DOM操作分类 jQuery中的各种DOM操作 查找节点 创建节点 删除节点 复制节点 替换节点 包裹节点 属性操作 样式操作 对HTML.文本和值的操作 遍历节点 CSS-DOM操作 小结 本 ...

  4. 第3章 jQuery的DOM操作

    一.  DOM 分为DOM核心,HTML-DOM和CSS-DOM 1.DOM核心 不专属与javascript. 获取对象:document.getElementsByTagName('div') 获 ...

  5. js获取节点的DOM操作

    一直感觉DOM节点什么的乱七八糟的不能理解,可能博客也没办法写清楚,只能把知道的一些信息大致写下来慢慢再补充了. HTML DOM类型 Node类型 Javascript中的所有节点类型都继承自Nod ...

  6. dom core,html dom,css dom,jquery 中的dom操作

    前端开发中为达到某种目的,往往有很多方法:dom core,html dom,jquery; dom core/jquery主要通过函数调用的方式(getAttribute("属性名&quo ...

  7. 第三章 jQuery中的DOM操作

    DOM(Document Object Model)文档对象模型,每张网页都能用DOM表示出来,每一份DOM都能看成一颗DOM树. jQuery继承了JavaScript对DOM对象操作的特性,使开发 ...

  8. javascript之文档碎片,文档碎片在理论上可以提高DOM操作的执行效率

    刚来到这里,趁着还没有忘记,来记录一下,昨晚学习的一个知识点——JavaScript中的文档碎片. 一.对文档碎片的基本认识 文档碎片可以提高DOM操作性能(理论上,注意!!理论上的) 文档碎片原理 ...

  9. jQuery中的DOM操作总结

    jQuery中的DOM操作 DOM是Document Object Medel的缩写,它的意思是文档对象模型,根据W3C的官方说法,DOM是一种跟浏览器,平台以及语言都没有关系的一种规范,也就是一种接 ...

随机推荐

  1. java8--异常处理(java疯狂讲义3复习笔记)

    try,catch,finally,throw,throws java将异常分为两种,Checked异常和Runtime异常. IndexOutOfBoundsException NumberForm ...

  2. delphi的万能数据库操作

    好多人都抱怨delphi没有提供一个可以把任意数据放入数据库的控件,虽然说用代码实现也不难,但是有控件会更方便,这次我终于还是抽出空来做了这么个控件,以后就可以直接拖放了.它支持把任意数据类型写入数据 ...

  3. diy数据库(二)--网络通信类

    一.首先,我们先实现OSS层的ossSocket类.供数据库client和数据库引擎进行通信 友情提示:相应上面的类图的头文件和源码附在了本文的最以下. int _fd ;//socket的文件描写叙 ...

  4. HTML5中meta属性

    meta属性在HTML中占据了很重要的位置.如:针对搜索引擎的SEO,文档的字符编码,设置刷新缓存等.虽然一些网页可能没有使用meta,但是作为正规军,我们还是有必要了解一些meta的属性,并且能够熟 ...

  5. (13)javaWeb中HttpServletRequest详解

    关于HTTP请求和响应,可以参考 HTTP协议 系列文章 导学,请求概述: a,GET和POST请求报文格式: b,常见的请求头 在servlet中,相应的doGet方法和doSet方法中的reque ...

  6. shell网络管理

    背景知识 联网就是通过网络将主机进行互联并采用不同的规范配置网络上的节点.我们以 TCP/IP 作为网络栈,所有的操作都是基于它进行的.网络是计算机系统中重要的部分.连接在网络上的每个节点都分配了一个 ...

  7. Watir: 对浏览器的保存文件操作, 其实应用的是AutoIt脚本

    def save_file(filepath) ai =WIN32OLE.new("AutoItX3.Control") ai.WinWait("FileDownload ...

  8. AutoIT: FileReadLine可以对文件进行读行操作

    $fHandle= ) Then $line= FileReadLine($fHandle) Then ExitLoop Wend EndIf FileClose($fHandle)

  9. MemCache在Windows下环境的搭建及启动

    sc create "memcached-11212" start= auto binPath= "D:\memcached_en32or64\x64\memcached ...

  10. Spark 大数据文本统计

    此程序功能: 1.完成对10.4G.csv文件各个元素频率的统计 2.获得最大的统计个数 3.对获取到的统计个数进行降序排列 4.对各个元素出现次数频率的统计 import org.apache.sp ...