# 浏览器的渲染(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. System.exit(1)

    用于退出java的虚拟机,也是finally块中语句不被执行的唯一情况

  2. EL简介

    一.EL简介 1.语法结构    ${expression}2.[]与.运算符    EL 提供.和[]两种运算符来存取数据.    当要存取的属性名称中包含一些特殊字符,如.或?等并非字母或数字的符 ...

  3. 使用GDB进行调试

    下面是几篇非常好的GDB使用指南: http://www.cs.cmu.edu/~gilpin/tutorial/ http://oss.org.cn/ossdocs/gnu/linux/gdb.ht ...

  4. linux mono环境

    安装好 CentOS 6.5 之后 1.更新系统 在命令行下执行 yum –y update 2.安装必要的软件 yum -y install gcc gcc-c++ bison pkgconfig ...

  5. Android IOS WebRTC 音视频开发总结(七三)-- 我为什么走上了创业这条不归路?

    本文主要介绍自己为什么选择创业,文章最早发表在我们的微信公众号上,支持原创,详见这里, 欢迎关注微信公众号blackerteam,更多详见www.rtc.help 2016.06.01对公司来说是个很 ...

  6. 退出系统时跳出frame框架

    传统的系统界面,有iframe页面,当用户退出系统或者session过期或者非法请求时,都要使当前页面跳转到登录页面.比如用户点击注销的按钮在上面得top.jsp里面,方法:<a href=&q ...

  7. 在一般处理文件中访问Session需要添加IRequiresSessionState(转载)

    原文:http://blog.csdn.net/cdsnaspnet/article/details/5695625s 通常我们经常,通过session判定用户是否登录.还有一些临时的.重要的数据也尝 ...

  8. 解决Cannot modify header information - headers already sent by

    output_buffering = On ,在php.ini中设置.

  9. object-assign合并对象

    1. Object.assign() 对于合并对象操作, ECMAScript 6 中提供了一个函数: Object.assign(target, source); 这个方法会将所有可枚举 [1] 的 ...

  10. JDK 环境变量设置

    .net转JAVA了.记心不好,记录一下. 安装好jdk(64位)后找到我的电脑(右键)>属性>高级选项卡>环境变量>,里面有管理员的用户变量,有系统变量.我选的是系统变量.点 ...