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. openstack kolla多节点容器化环境安装

    好久没写随笔了,6月份趁着在公司没有太忙的事儿,把公司的服务器进行了虚拟化,采用的openstack当前的容器化方案kolla. 整体安装完的感受时,小白感觉自己是个大牛!哈哈,开玩笑,由于以前是开发 ...

  2. 对于api安全性的思考

    目前的情况下api被很多地方应用,随之而来的是api的安全性问题. 我所认识到的安全性问题有以下几个方面: 1.DDoS(拒绝服务攻击),接口被恶意调用,使真实的用户无法享受到正常畅通的服务.     ...

  3. asp.net MVC 中呈现指定区域下的分部视图

    Html.RenderAction() 可以呈现分部视图. asp.net MVC就是有这种好处,可以将多个子视图无缝合成到一个视图上再输出,那么开发的时候,能够进行模块化开发.看上去同属一个页面上的 ...

  4. MYSQL之数据库初窥

    mysql数据库 1.数据库简单介绍    数据库概念:是依照数据结构来组织.存储和管理数据的仓库. 2.经常使用术语    数据库:是一些关联表的集合    数据表:表是数据的矩阵,在数据库中看起来 ...

  5. Count on an IEnumerable<dynamic>

    http://stackoverflow.com/questions/7733305/count-on-an-ienumerabledynamic int count = Enumerable.Cou ...

  6. AnimatorCompatHelper clearInterpolator

    supportLib 26.0.0+以上AnimatorCompatHelper类被移除 所以clearInterpolator(view)找不到 替换方案: TimeInterpolator mDe ...

  7. I.MX6 Android stlport 使用

    /****************************************************************** * I.MX6 Android stlport 使用 * 说明: ...

  8. bzoj 4543 HOTEL 加强版

    题目大意: 求树上取三个点这三个点两两距离相等的方案数 思路: 远古时候的$n^2$做法是换根 但那样无法继续优化了 学习了一波长链剖分 考虑如何在一棵树上进行dp 设$f[i][j]$表示以$i$为 ...

  9. bzoj1499 [NOI2005]瑰丽华尔兹——单调队列优化DP

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1499 朴素DP方程很好想,以右移为例,就是 f[i][x][y]=max(f[i][x][y ...

  10. 详解Python的*args和 **kwargs

    转自: http://www.python[tab].com/html/2016/pythonhexinbiancheng_0802/1057.html *args表示任何多个无名参数,它是一个tup ...