2020-08-02 html的WebStorage好处 + css的pointer-event + JS的绑定动态加载li的事件 + 软技能的前端错误分类及捕获

2020-08-02 题目来源：http://www.h-camel.com/index.html

[html] H5的Web Storage带来什么好处

WebStorage是H5提出的区别于cookie的一种Web存储技术，克服了由cookie带来的一些限制，存储大量可以跨会话存在的数据机制。

cookie的应用场景是浏览器与服务器之间的数据存储，大小、数量、长度均有限制，限制于浏览器。 WebStorage是一种信息的本地存储技术，适用数据需要被严格的控制在客户端，无需提至服务器的场景。

[css] 举例说明pointer-events有什么实际用途

1.点击穿透 pointer-event: none; //允许，也就是使鼠标事件失效 pointer-event: auto; //禁止

2.防止重复点击事件发生，例如获取验证码，设置一定时间内不能再次点击 

3.pointer-event:none; //可以禁止标签的页面跳转

4.pointer-event:none; //如果元素绝对定位，那么它的下层元素可以选中

5.pointer-event:none; //只能禁用鼠标的事件，其他方式绑定的事件还会触发

6.如果一个元素的子元素pointer-event:auto; 那么点击子元素的时候，会通过事件冒泡的形式触发父元素的事件

[js] 动态加载的li如何绑定事件

场景： 加载文档的时候，li标签并不存在，所以并不能给li加载事件。事件流包括 捕获、目标阶段、冒泡，那么最好的方法就是让父元素去查找子元素，冒泡阶段的过程中就会经过这个li标签，此时就可以获取了。

解决： jquery提供的on()函数

$('.main-content').on('click', 'li', function(e) {
        alert(this);
    });

ps：$( 父类选择器).on( " 事件","子类选择器" ,处理函数)

[软技能] 前端的错误有哪些分类？捕获这些错误？

1.前端特殊错误 https://blog.csdn.net/qq_25243451/article/details/78811776

2.前端错误处理 https://segmentfault.com/a/1190000015567273

3.前端错误捕获 https://www.cnblogs.com/cythia/p/11093231.html