每天懂点 js 小知识

1、a{blr:expression(this.onFocus=this.blur());}清除 A 链接在点击时会产生虚线的问题.<a href="link1.htm" onfocus="this.blur()">link1</a>
input {star : expression(onmouseover=function()
{this.style.backgroundColor="#FF0000"},
onmouseout=function(){this.style.backgroundColor="#FFFFFF"}) }
一般不建议使用expression，因为expression对浏览器资源要求比较高。
2、<a id="a">a</a> alert(a.innerHTML),JS可以直接使用标签属性的id，不用document.getElementById('a');
3、e.preventDefault() 
$('div').click(function (e) {
    alert(0);
e.preventDefault();
//如果div下面有a标签，a标签的跳转将会失效
//阻止了元素的默认行为
})
4.ECMAScript的值
ECMAScript中变量可以存在两种类型的值，即原始值和引用值。
原始值：
存储在栈（stack）中的简单数据段，也就是说，它们的值直接存储在变量访问的位置。
引用值：
存储在堆（heap）中的对象，也就是说，存储在变量处的值是一个指针（point），指向存储对象的内存处。
5.ECMAScript 有 5 种原始类型（primitive type），即 Undefined、Null、Boolean、Number 和 String。
原始类型:原始类型占据的空间是固定的，所以可将值存储在较小的内存区域 - 栈中。这样存储便于迅速查寻变量的值。
6.js对象（9个）Array,Boolean,Date,Math,Number,String,RegExp,Functions(JS全局对象,顶层函数（全局函数）),Events;
Browser对象（5个）：Window，Navigator，Screen，History，Location;
DOM对象(4)：document,element,attribute,event

7.控制css的多钟写法；
oop.style.backgroundColor = 'red';
oop.style = 'backgroundColor:red';
oop.style['backgroundColor'] = 'red';
oop.style['background-color'] = 'red';
oop.style.cssText = 'backgroundColor:red';

8.JavaScript命名——不要用name,self,top,location!否则程序结果就不是你预期的。他们都是window对象的属性不能做变量名
使用name作为变量名（var name = ‘’），在IE中未引起bug，在Chrome中引起bug但未明确指出命名错误，而是会报其他错误，故不便于发现。
譬如：let var name = [
	   			'赵小倩',
	   			'张钺涵',
	   			'张钺瞾',
	   			'张钺坤'];
	   			console.log(name[0])  //赵   md坑哒了  所以不要用name,self,top,location作为变量名；
	   			
9.从一个网站链接到另外一个网站会产生新的http请求，referrer是http请求中表示来源的字段。
no-referrer-when-downgrade表示从https协议降为http协议时不发送referrer给跳转网站的服务器。

10.   setInterval(function () {
      console.log(a) //10
        },1000);
        var a = 10;
        
        
        11.浏览器运行加载页面机制：
        浏览器的主要组件包括：

用户界面－ 包括地址栏、后退/前进按钮、书签目录等，也就是你所看到的除了用来显示你所请求页面的主窗口之外的其他部分。
浏览器引擎－ 用来查询及操作渲染引擎的接口。
渲染引擎－ 用来显示请求的内容，例如，如果请求内容为html，它负责解析html及css，并将解析后的结果显示出来。
网络－ 用来完成网络调用，例如http请求，它具有平台无关的接口，可以在不同平台上工作
UI 后端－ 用来绘制类似组合选择框及对话框等基本组件，具有不特定于某个平台的通用接口，底层使用操作系统的用户接口。
JS解释器－ 用来解释执行JS代码。


渲染引擎在取得内容之后的基本流程：
解析html以构建dom树->构建render树->布局render树->绘制render树


11.根据浏览器窗口大小适配页面
new function () {
            var bodyWidth = document.getElementsByTagName('body')[0];
            document.body.clientWidth < 800 ? (inht()) : (maxW());
            function inht() { bodyWidth.style.maxWidth = 'inherit'; }
            function maxW() { bodyWidth.style.maxWidth = '10rem'; }
        window.onresize = function () {
            document.body.clientWidth > 800 ? (maxW()) : (inht());
        }
        }
        
        
        

12、网站显示正在等待可用的套接字符(sockets)：
   （套接字：相当于一部电话）

服务器需要创建一个监听套接字，用于监听浏览器发送过来的请求。
浏览器也同样要创建一个套接字监听服务器返回消息；
360极速模式使用chrome内核，Chrome对同一个域名的sockets连接数作了限制，打开网页过多，连接数被消耗完了；
服务器忙，没有空闲的套接字响应浏览器；

13.一个对象获取数组中的值，此对象自动补全键（等于数组元素）
>
            var arr = ['哈哈', '哈额哈'];
                var obj = {}, newArr = [];
                    for (var i = 0, j = arr.length; i < j; i++) {
                        if (!obj[arr[i]]) {
                            newArr.push(arr[i]);
                            obj[arr[i]] = arr[i];
                        }
                }
obj[arr[i]]  //此对象自动补全键（等于数组元素）
复制代码