JS入门基础

`###1.CSS和JS在网页中的放置顺序是怎样的?
由于页面渲染规则及相关属性的关系
css外部引入代码一般放置于head标签之内;css文件可以几个同时进行加载
而JS外部引入的代码则放在所有元素之后</body>标签之前;js只能单个逐步加载

css有三种放入方式

  • 通过外部样式表放入
    link元素
    <head>
    <link rel="sheetstyle" type="text/css" href="example.css">
    </head>
    
   **@import元素**
  <style>
  @import url(example.css)可放入样式表内部,但必须放在其他样式元素之上,否则可能被忽略
  </style>

- 通过内联样式放入

<style>
a { text-decoration:none;}
p {border: 1px solid #eee;}
</style>

- 通过直接在元素标签内加入样式引入

<div style="display:inline-block">


>JS有两种引入方式

- 通过引入外部JS文件

<script type="text/javascript" src="example.js"></script>

- 直接嵌入js代码

<script type="text/javascript">
function sayHi(){
alert("Hi");
}
</script>

      
###2.解释白屏和FOUC
- 白屏产生原因
当样式表被放在页面底端的时候,对于某些情况(新窗口打开,刷新等),浏览器不会由上而下对代码进行逐一加载,而是会等到加载完所有css样式后,统一 进行,而这段时间内,页面都会展现内容,所以会出现白屏;
另外把js文件放入页面顶部,也会产生白屏现象。

- FOUC(flash of unstyle content)
同样的当样式放入页面底部时,(点击链接,输入url,使用书签进入时),浏览器会逐步加载无样式内容,当css全部加载完毕后,突然进行样式展现,产生fouc的情况。


###3.async和defer的作用是什么?有什么区别
**都只适用于外部js文件**
- async立即下载js文件,即排在js后续的文档也可并行开始,并且不影响其他文件的运行。
    不保证运行的顺序。例如两个依次排列的js文件,第二个js有可能先于第一个运行。
- defer 立即下载js文件,并且当所有文档完全解析后在运行;
  可保证运行的顺序,按照js文件的先后顺序进行加载,并且所有文档解析后,再加载js文件。

###4.简述网页的渲染机制

- 首先加载html标签,构建DOM tree;
- 其次对于css样式进行解析,构建CSS rule tree
- 解析Javascript脚本,主要是通过DOM API和CSSOM API来操作DOM Tree和CSS Rule Tree.
- 所有解析文档组合构建 render tree;
- 集合redner tree的节点,Layout – 定位坐标和大小
- 最后进行页面绘制正式开画

[参考文章](http://www.zhihu.com/question/20117417)

###5.JavaScript 定义了几种数据类型? 哪些是简单类型?哪些是复杂类型?
JavaScript定义了6中数据类型,5个简单类型,1个复杂类型;
- 简单类型
  -  null
  - undefind
  - number
  - string
  - boolean
- 复杂类型
 - object

###6.NaN、undefined、null分别代表什么?
- NaN
用来表示属于number数字类型的的非数字
- nudefined
用来表示未被定义的声明类型
- null
用来表示一个空的指针


###7.typeof和instanceof的作用和区别?
- typeof 运算符,可以判断一个变量的数据类型。
在使用 typeof 运算符时采用引用类型存储值会出现一个问题,无论引用的是什么类型的对象,它都返回 "object"。

- instanceof 运算符与 typeof 运算符相似,用于识别正在处理的对象的类型。与 typeof 方法不同的是,instanceof 方法要求开发者明确地确认对象为某特定类型。


 [instanceof 详解](https://www.ibm.com/developerworks/cn/web/1306_jiangjj_jsinstanceof/)
[运算符优先级](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Operator_Precedence)

版权归本人及饥人谷所有.
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • JavaScript基本概念、基础数据类型、运算符、流程控制语句。 一、CSS和JS在网页中的放置顺序是怎样的? ...
    婷楼沐熙阅读 527评论 0 2
  • ======================第一部分===================== =========...
    65_刘璐阅读 591评论 0 1
  • 1.CSS和JS在网页中的放置顺序是怎样的? css一般放在头部head标签中,网页渲染时,先解析html标签,生...
    _Josh阅读 411评论 0 1
  • 嫁叶黄,粮满仓。风波荡,人心凉。蛮夷把酒,中原痴狂。三十功名,二八彷徨,终究梦一场。 白玉京,微微亮。智者浪,仁者...
    匹马观潮阅读 304评论 0 0
  • 不论如何丑恶的偏见,它的产生绝对不是历史和地域的错。 《恶意》讲述的是一个畅销作家日高被谋杀后,警官加贺通过对事实...
    南苘阅读 4,929评论 0 2

友情链接更多精彩内容