几个前端的知识点笔记1

1.link和@import的区别?

<link rel='stylesheet' rev='stylesheet' href='CSS文件 ' type='text/css' media='all' />

<style type='text/css' media='screen'>

@import url('CSS文件 ');

两者都是外部引用CSS的方式，但是存在一定的区别：
区别1： link 是 XHTML 标签，除了加载 CSS 外，还可以定义 RSS 等其他事务； @import 属于 CSS 范畴，只能加载 CSS 。
区别2： link 引用 CSS 时，在页面载入时同时加载； @import 需要页面网页完全载入以后加载。
区别3： link 是 XHTML 标签，无兼容问题； @import 是在 CSS2.1 提出的，低版本的浏览器不支持。
区别4： link 支持使用 Javascript 控制 DOM 去改变样式；而 @import 不支持。

2.浏览器内核
a、 IE: trident 内核
b、 Firefox ： gecko 内核
c、 Safari:webkit 内核
d、 Opera: 以前是 presto 内核， Opera 现已改用 Google Chrome 的 Blink 内核
e、 Chrome:Blink( 基于 webkit ， Google 与 Opera Software 共同开发 )

3.描述一下 cookies，sessionStorage 和 localStorage 的区别?

sessionStorage 和 localStorage 是 HTML5 Web Storage API 提供的，可以方便的在 web 请求之间保存数据。有了本地数据，就可以避免数据在浏览器和服务器间不必要地来回传递。
sessionStorage、 localStorage 、 cookie 都是在浏览器端存储的数据，其中 sessionStorage 的概念很特别，引入了一个“浏览器窗口”的概念。 sessionStorage 是在同源的同窗口（或 tab ）中，始终存在的数据。也就是说只要这个浏览器窗口没有关闭，即使刷新页面或进入同源另一页面，数据仍然存在。关闭窗口后， sessionStorage 即被销毁。同时“独立”打开的不同窗口，即使是同一页面， sessionStorage 对象也是不同的
cookies会发送到服务器端。其余两个不会。
Microsoft 指出 Internet Explorer 8 增加 cookie 限制为每个域名 50 个，但 IE7 似乎也允许每个域名 50 个 cookie 。 Firefox 每个域名 cookie 限制为 50 个。 Opera 每个域名 cookie 限制为 30 个。 Firefox 和 Safari 允许 cookie 多达 4097 个字节，包括名（ name ）、值（ value ）和等号。 Opera 许 cookie 多达 4096 个字节，包括：名（ name ）、值（ value ）和等号。 Internet Explorer 允许 cookie 多达 4095 个字节，包括：名（ name ）、值（ value ）和等号。

区别：

• Cookie

• 每个域名存储量比较小（各浏览器不同，大致 4K ）

• 所有域名的存储量有限制（各浏览器不同，大致 4K ）
• 有个数限制（各浏览器不同）

• 会随请求发送到服务器

• LocalStorage

• 永久存储
• 单个域名存储量比较大（推荐 5MB ，各浏览器不同）

• 总体数量无限制

• SessionStorage

• 只在 Session 内有效
• 存储量更大（推荐没有限制，但是实际上各浏览器也不同）

4.超链接target属性的取值和作用？
target这个属性指定所链接的页面在浏览器窗口中的打开方式。
它的参数值主要有：
a、 _blank ：在新浏览器窗口中打开链接文件
b、 _parent ：将链接的文件载入含有该链接框架的父框架集或父窗口中。如果含有该链接的框架不是嵌套的，则在浏览器全屏窗口中载入链接的文件，就象 _self 参数一。
c、 _self ：在同一框架或窗口中打开所链接的文档。此参数为默认值，通常不用指定。但是我不太理解。
d、 _top ：在当前的整个浏览器窗口中打开所链接的文档，因而会删除所有框架。

5.如何实现浏览器内多个标签页之间的通信?

WebSocket、 SharedWorker ；
也可以调用localstorage、 cookies 等本地存储方式；
localstorage另一个浏览上下文里被添加、修改或删除时，它都会触发一个事件，
我们通过监听事件，控制它的值来进行页面信息通信；
注意quirks： Safari 在无痕模式下设置 localstorge 值时会抛出 QuotaExceededError 的异常；

6.CSS中选择器的类型
基础选择器
组合选择器 E,F E+F E F E>F
属性选择器 E[att] E[att=val] E[att~=val] E[att|=val]
伪类
伪元素
内联>ID选择器>伪类>属性选择器>类选择器>标签选择器>通用选择器(*)>继承的样式
内嵌样式 > 内部样式表 > 外联样式表
内嵌样式：内嵌在元素中，<span style="color:red">span</span>
内部样式表：在页面中的样式，写在<style></style>中的样式
外联样式表：单独存在一个css文件中，通过link引入或import导入的样式
important > 内嵌 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符

7.__dirname 和 ./ 的区别
ode.js 中，__dirname 总是指向被执行 js 文件的绝对路径，所以当你在 /d1/d2/myscript.js 文件中写了 __dirname， 它的值就是 /d1/d2 。
相反，./ 会返回你执行 node 命令的路径，例如你的工作路径。
有一个特殊情况是在 require() 中使用 ./ 时，这时的路径就会是含有 require() 的脚本文件的相对路径。

8.判断数据类型
https://www.cnblogs.com/dushao/p/5999563.html