放置顺序
CSS一般放置在<head>标签内
如果css放在底部或者使用@import方式引入
某些浏览器例如Firefox,其渲染机制是:网页加载到哪里就绘制到哪里。
这样就出现无样式内容闪烁。这种现象称为FOUC 。JS一般放置在</body>标签前
如果JS放在前面的其他位置
1 某些浏览器例如chrome,其渲染机制是:等所有的标签和样式解析完成以后,再绘制网页。
2 加载JS会阻塞其后组件的下载,会影响其后内容的呈现。
这样会出此现长时间白屏。
如何解决白屏问题?(当JS放置在<head>标签内)
设置异步加载,即加载和渲染后面文档元素的过程将和js文件的加载和执行同时进行。
1 <script async src="script.js"></script> 加载到哪里,JS就执行到哪里。
2 <script defer src="script.js"></script> 所有元素加载完成之后,再执行JS。
渲染机制
1.浏览器解析HTML,创建DOM树;解析CSS,创建CSS树。
2.合并DOM树和CSS树,创建渲染树。
3.根据渲染树进行布局,计算每个点的几何结构。
4.根据几何结构,绘制出网页。
数据类型
原始类型 | 最基本,无法细分 | 例子 |
---|---|---|
String | 字符组成的文本 | var myVariable = 3.14; |
Number | 整数和小数 | var myVariable = "Hello World"; |
Boolean | (真)和(假)两个特定值 | var myVariable = true; |
特殊类型 | 区别 | 用法 |
---|---|---|
Undefined | 目前不存在任何值 | 1 变量被声明了,但没有赋值 |
2 调用函数时,应该提供的参数没有提供 | ||
3 对象没有赋值的属性 | ||
4 函数没有返回值 | ||
Null | 有一个值,但目前为空 | **1 ** 作为函数的参数 |
** 2 ** 作为对象原型链的终点 | ||
NAN | (not a number)非数字 | 和任何值都不相等,包括自己 |
合成类型 | 多个原始类型的值的合成 | 例子 |
---|---|---|
Object (广义) | 各种值组成的集合,</br>可以看作是一个存放各种值的容器 | -- |
object(狭义) | 数据组合方式1 | ---- |
array | 数据组合方式2 | ---- |
function | 处理数据的方法 | ---- |
判断变量
type 类型
typeof 判断一个值的数据类型
返回类型:
1 原始 number, boolean,string;
2 函数 function;
3 特殊 undefined ;(利用这一点,typeof可以用来检查一个没有声明的变量)
4 其他 objectinstance 实例
instanceof 判断一个值是不是某种对象的实例
返回类型:
1是 则返回 ture ;
2不是 则返回 false