JS防抖与节流实现

引入 我们在对窗口的resize、scroll进行事件监听时，可能会导致事件处理函数被无限制调用，这样做会增加浏览器负担，如果事件处理函数有AJAX的话会造成无限次请求，给服务器也带来了负担。 如下例 var i = 1; wi...

JS懒加载实现

原理 服务端渲染后的图片地址并不立即赋给`img`标签的`src`属性，而是赋给自定义属性如`data-src` 当`img`标签呈现在当前浏览器可视窗口时，动态设置`img`标签的`src`属性 相关API document.documentElement.cl...

webpack 打包 Support for the experimental syntax 'classProperties' isn't currently enabled

解决方案：安装如下插件 npm i -D @babel/plugin-proposal-class-properties 在babelrc中配置插件： ` { "presets": ["@babel/env"], "plugins": ["@babel/plugin-transform-runtime","@babel/plugin-pr...

启动项目报错this.setDynamic is not a function

此处项目中babel-loader版本为8. ，@babel/core为7.12.9（babel从7.0后更名为@babel） babel7之后的插件一般都是以@babel/开头的。 例子 babel7以前npm安装core npm i babel-core --save-dev babel7以后...

前端葵花宝典

HTML/CSS面试题 [1.什么是盒模型](https://www.zihanzy.com/articles/282) [2.行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？行内元素和块级元素有什么区别？](https://www.zihanzy.com/articles/283) [3....

CSS 水平居中与垂直居中的16个方法

水平居中 行内元素 .parent{ text-align:center } 块级元素 .son { margin: 0 auto; } 子元素含 float .parent{ width:fit-content; margin:0 auto; } .son { floa...

CSS3有哪些新特性?

新增选择器 p:nth-child（n）{color: rgba（255, 0, 0, 0.75）} 弹性盒模型 display: flex; 多列布局 column-count: 5; 媒体查询 @media （max-width: 480px） {.box: {column-count: 1;}} 个性化字体 @font-face{fo...

页面导入时，使用link和@import有什么区别

import 和 link的区别 1、从属关系：link是html的标签，不仅可以加载 CSS 文件，还可以定义 RSS、rel 连接属性等；而@import是css的语法，只有导入样式表的作用。 2、加载顺序：页面被加载时，link会和html同时被加...

简述src和href的区别

定义 href是`Hypertext Reference`的简写，表示超文本引用， 指向 网络资源所在位置。 常见场景 ` ` `` src是`source`的简写，目的是要把文件 下载 到html页面中去。 常见场景 ` ` `` `` 作用结...

行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？行内元素和块级元素有什么区别？

行内元素 行内元素：span，strong，em，br，img，input，label，select，textarea，cite 块级元素 块级元素：div，p，from，ul，li，ol，dl，address，fieldset，hr，menu，table 空（void）元素 void元素...