keleqy-CSDN博客

转载 Vue中常见的事件修饰符及其作用

在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在方法中轻松实现这点，但更好的方式是：方法只有纯粹的数据逻辑，而不是去处理 DOM 事件细节。以下是Vue提供的一些事件修饰符：.stop：阻止事件冒泡，相当于event.stopPropagation() .prevent：取消预设行为，相当于event.preventDefault() .capture：启用事件捕获（与冒泡相反，从外到内进行事

2021-07-28 16:41:09 2249

原创 script标签中的defer和async属性的区别？

script 标签一般用于加载js脚本，我们知道js脚本是阻塞式加载和执行的，即页面解析到 script 标签时会暂停页面的解析，先加载脚本并执行脚本后再继续页面的解析。而H5新增的两个属性： defer 和 async，可以让脚本异步叫载，但脚本的执行方式有所不同， defer 是延迟的意思，所以脚本会在页面加载结束的再执行，而 async 是异步的意思，脚本只会异步加载，并立即执行。页面的加载、脚本加载荷脚本执行示意图如下所示：总结来说就是， defer 和 async 属性让 scri..

2021-07-23 11:06:17 339

原创 Vue的基本实现原理

以往的前端都是使用js直接控制DOM来实现页面的变化，js也更像是为页面服务的小弟（脚本）。但随着web应用的复杂化，js和页面的复杂程度和以往相比都不是一个量级的，有组织有架构的工程化开发就变得十分必要，随着MV*类架构的发展，很多桌面应用都迁移到了web端，变成了web app，也就是单页面应用（single page web application）。在这些变化中，数据驱动试图成为主流设计，比如Vue采用的MVVM模型也是如此：Vue实例创建时：解析指令（Compiler）：通过 temp

2021-07-02 15:54:40 2638 1

原创判断js数据类型的方法有哪些？

js数据类型分为两种：基本数据类型和引用数据类型。一般情况下，判断基本数据类型使用 typeof 关键字，而判断引用类型使用 instanceof 关键字。

2021-06-29 10:14:30 81

原创 css中有哪些常见的可继承属性，不可继承属性？

样式继承的目的是为了更好地适应页面变化，也就是修改样式时让页面更平滑地过度：设置父元素时希望子元素样式保持统一，那么就继承，如果继承后页面属性变化比较突兀，就不应该继承，比如我设置了 div 的字体大小...

2021-06-25 15:51:50 436

原创对HTML 标签语义化的理解，常见的语义化标签有哪些？

语义化就是我们通过标签本身就知道标签所在代码的内容具有什么意义，即用使用特定的功能属性的标签做特定的事。比如使用 h1 标签我们就知道这是一个标题，使用 header 就知道这是页眉，shi yon...

2021-06-22 09:40:17 1678

原创 js数据类型有哪几种？有何区别？

目前最新的 ECMAScript 标准中定义了9种数据类型。其中，有7种基本数据类型：undefined：为定义 null：空w

2021-06-15 09:26:46 364 1

转载 css选择器有哪些？如何判断优先级？

四类选择器css选择器可以分为四大类：基本选择器分组选择器组合选择器伪选择器最常用的就是基本选择器，一般来说有五种基本选择器：通用选择器：* ，匹配所有元素元素选择器：使用元素名称进行元素匹配，比如 a、p 类选择器：通过类名匹配原色，比如 .class 属性选择器：通过元素的属性来匹配元素，如 a[href] id 选择器：通过元素 id 来匹配元素，如 #app。值得注意的是，id选择器不是匹配一个元素而是多个（当然我们不希望页面有相同id的元素）。这五种基本选择器

2021-06-11 09:15:34 447

转载 html标签的src属性和href属性的区别

src 属性是source的缩写，意思为来源，一般作为媒体元素 HTNLDediaElement 的媒体资源映射URL。例图片、脚本的资源路径：<img src="image/demo.png"><iframe src="inner.html"><script src="demo.js"></script> src 加载媒体资源时时阻塞式的，页面的其他资源会暂停处理，这就是为什么一般吧 script 脚本标签放在文档末尾加载的一个原因。..

2021-06-09 09:58:54 3701

原创 Echarts 折线图加载图表后数据不正确、叠加

Echarts 折线图加载图表后数据不正确、叠加第一次加载的图表，数据正确第二次加载的图表，数据只有3条，但展示的数据和之前的叠加参数配置前，错误图表参数配置后，正确图表方法1.配置setOption第二个参数notMerge:chart.setOption(option,true);第二个参数notMerge 是否不跟之前的option进行合并；true 即表示不合并；2.清除画布：chart.clear();chart.set...

2021-06-01 14:08:46 944

keleqy的博客