zoukankan      html  css  js  c++  java
  • dom优化

    dom是什么?文档对象模型,用来操作html文档的,html的标签,节点(元素节点,文本节点,空白节点,注释节点),等等
    javescript由3部分构成,1,dom(操作html的,appendChild等等) 2,ECMA,(js的,,)3,bom浏览器对象模型(location等等)

    怎么优化dom性能?
    1.减少js操作dom,(把dom元素放到一个变量里,传变量)如for循环可以把str+='a',再for循环外innerHTML=str;
    2.innerHtml和dom方法法哪个好,,innerHTML方法稍微好(火狐下)dom方法好(谷歌下);所以分开来做,看需求。
    3.减少dom操作,1.用cloneNode()代替每次creatElement;
    2.把一堆集合变成局部变量,for循环里i<xx.length;改为a=xx.length;i<a;或者多次用到元素也变成变量var doc=document;
    3.元素节点,尽量用只获取元素节点的方法;(少用childNode,用children等具体点);
    4,选择器API,querySelect,querySelectAll('#UL li');IE8以上支持

    4.dom与BOM:重排,重绘
    1. 先其他操作,再appendChild,
    2.合并css样式操作,csstext可以合并多次操作(加宽高背景等);xx.style.csstext="100px;height:100px;background:red";
    3.利用缓存布局信息;(把每次用到的offsetLeft,offsetTop var=xx,xx++);
    4,文档碎片,creatDocumentFrame()--->收集文档碎片的袋子,oFrag.appendChild(oLi);
    5.事件委托
    6.DOM与前端模板(例如jquery的temp)的分离::逻辑与视图分离,提高整体性能,不是dom性能;

  • 相关阅读:
    索引的使用说明
    如何在Linux 发行版本CentOS安装Oracle
    GNU/Linux 初學之旅
    Oracle数据库监听配置(转)
    Linux学习笔记7用户建立密码设置及删除用户
    Linux学习笔记6ls命令
    linux vi命令使用
    生成1千万个随机串号9位英文字母
    郁闷的夏天
    网络爬虫
  • 原文地址:https://www.cnblogs.com/zhangxinxin111/p/4724349.html
Copyright © 2011-2022 走看看