CSS 计数器:counter

之前在实现代码行号的时候发现 CSS 有个很方便的功能“计数器”,可以很方便的生成代码行号以及章节号,本文介绍一些这些功能。 css 计数器有三部分组成: counter-reset、counter-increment 两个属性和函数 counter()/counters()。下面介绍一下它们的使用…

React Error Boundaries(错误边界)

过去,组件内部的 JavaScript 错误经常会破坏 React 的内部状态,并导致它在下一次渲染时发生奇奇怪怪的错误。这些错误通常总是由应用程序代码中的早期错误引起,但在之前版本的 React 没有提供在组件中优雅地处理它们的方法。 针对“部分 UI 的错误不应当导致整个应用的崩溃” 这个理念,…

link 标签的预加载相关属性的简单介绍

我们知道,浏览器在解析文档的时候如果遇到引入的外部资源,需要下载外部资源,如果有些外部资源比较大,可能会需要一个较长的下载时间,而资源预加载技术就是为了部分解决这样的问题的。 资源预加载顾名思义,就是预测将来可能需要的一些资源,并在当前对这些资源进行预先加载的技术。 很明显,资源预加载对优化当前页面…

script 标签上的 async 与 defer

我们知道,html 在解析过程中,如果遇到外部的脚本,会暂停当前页面的解析过程,而是去下载这个引入的外部脚本,然后执行这个外部脚本,这样无疑会导致当前的页面的渲染被阻塞,这也是为什么建议将脚本文件的加载放在文档的最后。 script 标签新增加了两个布尔属性 defer 和 async 用于控制脚本…

字符串的重复和补全的新函数

字符串的重复,追加补全也是常用的操作, ES 的新标准也为字符串添加了几个支持这样操作的函数,提供了操作的方便,之前一直没注意到这几个方法,这里做一个补充。 repeat将源字符串重复多次后返回 string.repeat(count); count 指定字符串重复次数,重复次数不能小于0,如…

JS 中的 this

JS 中的 this 是一个很容易让人迷糊的概念,本文主要总结了各种情况下的 this 指向。 全局环境中的 this全局环境中的 this 总是指向全局对象 window 上的。 this.a1 = 10;var a2 = 20;console.log(a1); // 10console.log(…

Javascript 原生创建和修改 DOM 节点的方法

本文总结了常用的 js 进行 DOM 修改的操作,主要总结节点的创建、修改和元素属性的管理的一些相关的操作。 节点创建常用的和节点创建有关的接口主要有:document.createElement、document.createTextNode 、document.createDocumentFra…