# 浏览器的渲染(HTML解析)

——参考:

《前端必读:浏览器内部工作原理》http://kb.cnblogs.com/page/129756/

《谈谈DOMContentLoaded:Javascript中的domReady引入机制》http://www.cnblogs.com/horve/p/4092064.html

——基本渲染流程,不包含图片,PDF,flash等特殊资源的渲染

* 蓝色部分为浏览器内部的运算

* window.onload  DOM树构建完成和文件资源加载完毕后执行

— 存在短板:当dom构建完成,文件很大未加载完时,页面呈现等待状态(容易让人误会卡死,用户体验不好)

— 解决方案:

#代码只执行一次(或单次循环使用)的方案:
首先,命名一个标示:
var TF = false; // 初始值用false,比true有利(TF无论值是什么,存在即true)
其次,通过if判断执行:
if(!TF){
TF = true;
// 具体代码… (如果需要再次使用在具体代码最后 TF = false; 即可)
fn(){ };
};
new Date().getTime(); // 获取当前的时间戳
a.innerHTML = ‘xxxx’; // 获取对象a的内容并设置为新的内容xxxx
a.nextSibling // 获取对象a的下一个节点
document.createElement(‘div’) // 创建一个div元素
a.appendChild(b) // 向节点a的子节点列表的结尾添加新的子节点b
a.removeChild(b) // 删除(并返回)当前节点a的指定子节点b
a.parentNode // 获取对象a的父节点(上一级)

*==和===的区别  [!!a && a.nodeType === 1; 释义:对象a存在,并且a属于元素节点]

——参考:

http://www.cnblogs.com/yiki/archive/2012/05/08/2489687.html

http://www.cnblogs.com/fumj/p/3477850.html

http://www.cnblogs.com/yiki/archive/2012/05/08/2489687.html

*关于instanceof

——参考:http://blog.sina.com.cn/s/blog_532751d90100iv1r.html

*怎样判断点击的是js对象还是dom对象:

——参考:http://stackoverflow.com/questions/384286/javascript-isdom-how-do-you-check-if-a-javascript-object-is-a-dom-object/27112297#27112297

* try catch的运用

——参考:http://www.cnblogs.com/luluping/archive/2011/02/14/1954092.html


#HTML嵌套规则及相关知识

 

 

 

【笔记】DOM探索基础篇(二)的更多相关文章

  1. 【笔记】DOM探索基础篇(一)

    #DOM探索(前端课程学习笔记)http://www.imooc.com/video/9502 DOM = document + object + model ECMAScript 编写js应遵守的标 ...

  2. DOM系列---基础篇

    DOM系列---基础篇   DOM (Document Object Model) 即文档对象模型, 针对 HTML 和 XML 文档的 API (应用程序接口) .DOM 描绘了一个层次化的节点树, ...

  3. php基础篇-二维数组排序 array_multisort

    原文:php基础篇-二维数组排序 array_multisort 对2维数组或者多维数组排序是常见的问题,在php中我们有个专门的多维数组排序函数,下面简单介绍下: array_multisort(a ...

  4. JavaScript笔记基础篇(二)

    基础篇主要是总结一些工作中遇到的技术问题是如何解决的,应为本人属于刚入行阶段技术并非大神如果笔记中有哪些错误,或者自己的一些想法希望大家多多交流互相学习. 1.ToFixed()函数 今天在做Birt ...

  5. [Java入门笔记] 面向对象编程基础(二):方法详解

    什么是方法? 简介 在上一篇的blog中,我们知道了方法是类中的一个组成部分,是类或对象的行为特征的抽象. 无论是从语法和功能上来看,方法都有点类似与函数.但是,方法与传统的函数还是有着不同之处: 在 ...

  6. Qt入门之基础篇 ( 二 ) :Qt项目建立、编译、运行和发布过程解析

    转载请注明出处:CN_Simo. 题解: 本篇内容主讲Qt应用从创建到发布的整个过程,旨在帮助读者能够快速走进Qt的世界. 本来计划是讲解Qt源码静态编译,如此的话读者可能并不能清楚地知道为何要静态编 ...

  7. NIO相关基础篇二

    转载请注明原创出处,谢谢! 上篇NIO相关基础篇一,主要介绍了一些基本的概念以及缓冲区(Buffer)和通道(Channel),本篇继续NIO相关话题内容,主要就是文件锁.以及比较关键的Selecto ...

  8. Hybrid APP基础篇(二)->Native、Hybrid、React Native、Web App方案的分析比较

    说明 Native.Hybrid.React.Web App方案的分析比较 目录 前言 参考来源 前置技术要求 楔子 几种APP开发模式 概述 Native App Web App Hybrid Ap ...

  9. docker+k8s基础篇二

    Docker+K8s基础篇(二) docker的资源控制 A:docker的资源限制 Kubernetes的基础篇 A:DevOps的介绍 B:Kubernetes的架构概述 C:Kubernetes ...

随机推荐

  1. zhuang 自定义Xcode代码模板:Code Snippet

    Xcode强大的代码提示功能是有目共睹的,用过都知道,可是你是否想过添加一些自定义的代码提示模板?你是否想让if默认的左括号挪到下一行?还有for.while.switch等等……如果你有这方面的需求 ...

  2. windows下使用VS2010编译jpeglib

    1.下载源代码下载地址:http://www.ijg.org/files/,    选择最新版本的windows版本压缩包,进行下载.    jpegsr9a.zip    1042 Kb    Su ...

  3. 纸上谈兵:伸展树(splay tree)

    作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 我们讨论过,树的搜索效率与树的深度有关.二叉搜索树的深度可能为n,这种情况下,每次 ...

  4. C# RSA 算法

    RSA公钥加密算法是1977年由Ron Rivest.Adi Shamirh和LenAdleman在(美国麻省理工学院)开发的.RSA取名来自开发他们三者的名字.RSA是目前最有影响力的公钥加密算法, ...

  5. 通过Percona XtraBackup添加一个slave

    假设我的master是172.16.15.8,要添加的slave是172.16.15.9 1:在主服务器执行备份操作(172.16.15.8) /usr/bin/innobackupex --comp ...

  6. VBS使用Scripting.Dictionary字典对象

    Scripting.Dictionary是个很有用的组件,其创建了类似于Key索引对应Value值的字典对象,并且在其内部提供了快速索引访问的机制,可以让我们通过Key直接索引到指定的Value,比遍 ...

  7. [Tomcat 源码分析系列] (附件) : catalina.bat 脚本

    摘自 apache-tomcat-8.0.39-src 源码包中的 catalina.bat 脚本内容 @echo off rem Licensed to the Apache Software Fo ...

  8. [纯小白学习OpenCV系列]官方例程00:世界观与方法论

    2015-11-11 ----------------------------------------------------------------------------------- 其实,写博 ...

  9. 使用css3中calc()进行自适应布局

    calc()能做什么? calc()可以通过计算得到元素的宽度或者高度,让我们很容易进行自适应布局. 你可以为一个div元素,使用百分比.em.px和rem单位值计算出其宽度或者高度,比如说“widt ...

  10. 终极优化_详解Win7旗舰版系统中可以关闭的服务

    Win7旗舰版系统是一款功能强大的系统,不过对于很多用户很多功能却使用不上,而支持功能的很多服务也多少占用了系统资源,那么我们可以通过关闭一些不使用的服务来达到让win7系统运行速度加快的目的.下面小 ...