08 2021 档案

摘要:一、for...in引发的一个报错 两年前写的一个文章目录生成插件vue-outline,一直用着没出啥问题(本站的文章目录也是用该插件生成的)。但是最近一个网友在使用的时候却出现了异常报错,异常代码使用了一个for...in遍历数组: for (let idx in selectors) { le 阅读全文
posted @ 2021-08-16 20:28 陌路y
摘要:前端开发最重要的部分之一是通过发出HTTP请求与后端进行通信,我们有几种方法可以异步地在JavaScript中进行API调用。 几年前,大多数应用程序都使用Ajax发送HTTP请求,Ajax代表异步JavaScript和XML。但是现在,开发人员通常会决定在 .fetch() API和Axios之间 阅读全文
posted @ 2021-08-16 20:27 陌路y
摘要:之前有很多人问学好前端需要学习哪些 js 库, 主流框架应该学 vue 还是 react ? 针对这些问题, 笔者来说说自己的看法和学习总结. 首先我觉得在学习任何知识之前必须要有一个明确的学习目标, 知道自己为什么要学它, 而不是看网上说的一股脑的给你灌输各种知识, 让你学习各种库, 从而不断的制 阅读全文
posted @ 2021-08-16 20:26 陌路y
摘要:索引类型 下面我通过一个官方的例子来说明下什么是索引类型: function pluck(o, names) { return names.map((n) => o[n]) } 这是个简单的函数,names 是一个数组,里面是 key 值,我们可以从“o”里面取出这些 key 值,理想情况下 nam 阅读全文
posted @ 2021-08-16 20:25 陌路y
摘要:一、拦截器InterceptorManager 遇见这个需求,或许从axios文档中,我们第一时间想到的就是InterceptorManager。 axios.interceptors.request.use(req => { // todo 加密 }) axios.interceptors.res 阅读全文
posted @ 2021-08-16 20:24 陌路y
摘要:写在前面 工欲善其事,必先利其器,本文之器非器具之器,乃容器也,言归正传,作为一个前端打工人,左手刚 const 定义常量,忠贞不二,转头就 new 几个对象,玩的火热,真是个优秀的 jser,风骚的操作背后,必有日夜不辍的 QWER,外加一个走 A,废话不多说,浏览器内核是啥玩意?还不知道都有啥浏 阅读全文
posted @ 2021-08-16 20:23 陌路y
摘要:1.返回值 forEach()方法返回undefined ,而map()返回一个包含已转换元素的新数组。 const numbers = [1, 2, 3, 4, 5]; // 使用 forEach() const squareUsingForEach = []; numbers.forEach(x 阅读全文
posted @ 2021-08-16 20:21 陌路y
摘要:弹窗(popup)是向用户显示其他文档的最古老的方法之一。基本上,你只需要运行: window.open('https://JavaScript.info/') 它将打开一个具有给定 URL 的新窗口。大多数现代浏览器都配置为在新选项卡中打开 url,而不是单独的窗口。 弹窗自古以来就存在。最初的想 阅读全文
posted @ 2021-08-16 20:20 陌路y
摘要:在函数式编程中,Monad 是一种结构化程序的抽象,我们通过三个部分来理解一下。 Monad 定义 Monad 使用场景 Monad 一句话解释 Monad 定义 根据维基百科的定义,Monad 由以下三个部分组成: 一个类型构造函数(M),可以构建出一元类型 M<T>。 一个类型转换函数(retu 阅读全文
posted @ 2021-08-16 20:19 陌路y
摘要:正文 在Node.js中,内置了两个模块来进行模块化管理,这两个模块也是两个我们非常熟悉的关键字:require和module。内置意味着我们可以在全局范围内使用这两个模块,而无需像其他模块一样,需要先引用再使用。 无需 require('require') or require('module') 阅读全文
posted @ 2021-08-16 20:17 陌路y
摘要:前言 前后端数据交互经常会碰到请求跨域,什么是跨域,以及有哪几种跨域方式,这是本文要探讨的内容。 一、什么是跨域? 1.什么是同源策略及其限制内容? 同源策略是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSRF等攻击。所谓同源是指"协议+域名+端口"三 阅读全文
posted @ 2021-08-16 20:15 陌路y
摘要:前言 项目启动时 css 应该注意哪些问题 文件名规范 文件名建议用小写字母加中横线的方式。为什么呢?因为这样可读性比较强,看起来比较清爽,像链接也是用这样的方式,例如 // 地址: github的地址 https://github.com/wangjeaf/ckstyle-node 那为什么变量名 阅读全文
posted @ 2021-08-15 17:31 陌路y
摘要:pointer-events css 属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target。 /* Keyword values */ pointer-events: auto; pointer-events: none; pointer-events: visibl 阅读全文
posted @ 2021-08-15 17:31 陌路y
摘要:css 变量技术,其兼容性可点击如下链接查看: CSS Variable兼容性 具体用法 使用 -- 声明变量,使用 var() 函数获取变量。 :root{ --header-height: 70px; } body { --color: white; } .header { height: va 阅读全文
posted @ 2021-08-15 17:30 陌路y
摘要:自适应的椭圆 1.自适应的椭圆 实现方式是通过border-radius这个属性;border-radius它可以单独指定水平和垂直半径。用 / 分隔这两个值。并且该属性的值不仅可以接受长度值,还能接收百分比的值。百分比的值会基于元素的尺寸进行解析,宽是水平半径的解析,高是垂直半径的解析。 所以可以 阅读全文
posted @ 2021-08-15 17:28 陌路y
摘要:设置滚动条的样式: div::-webkit-scrollbar { width: 0; } 关于::-webkit-scrollbar ::-webkit-scrollbar css伪类选择器影响了一个元素的滚动条的样式 ::-webkit-scrollbar 仅仅在支持WebKit的浏览器 (例 阅读全文
posted @ 2021-08-15 17:27 陌路y
摘要:最近做移动端页面时,经常会用到inline-block元素来布局,但无可避免都会遇到一个问题,就是inline-block元素之间的间隙。这些间隙会导致一些布局上的问题,需要把间隙去掉。对于inline-block元素及去掉间隙的方法,在这里做一个简单的总结。 inline-block是什么? in 阅读全文
posted @ 2021-08-15 17:14 陌路y
摘要:html5是构建Web内容的一种语言描述方式。html5是互联网的下一代标准。css3是css(层叠样式表)技术的升级版本。下面我们来看一下HTML5余css3的新特性有哪些。 CSS3新特性: 1.颜色:新增RGBA,HSLA模式 2. 文字阴影(text-shadow、) 3.边框: 圆角(bo 阅读全文
posted @ 2021-08-15 17:12 陌路y
摘要:css中可以使用cursor属性设置鼠标的手势,cursor属性规定要显示的光标的类型(形状)。该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状。 css设置不同鼠标手势: <html> <body> <p>请把鼠标移动到单词上,可以看到鼠标指针发生变化:</p> <span> Auto< 阅读全文
posted @ 2021-08-15 17:10 陌路y
摘要:css设置div背景透明有两种方法:第一种使用opacity:0~1,这个方法有个缺点,就是内容也会跟着透明;第二种方法就是rgba(0,0,0,0~1),使用这个方法就只会设置div背景透明,而不会影响到div里的内容。 一、css rgba()设置颜色透明度 语法: rgba(R,G,B,A); 阅读全文
posted @ 2021-08-15 17:09 陌路y
摘要:新标签页中打开一个网址如何出现安全漏洞 让我们在网站上的新标签页中打开一个网址,html如下 <a href="https://malicious-domain.netlify.com" target="_blank"> 访问恶意网站! </a> 这里我们有一个指向恶意网站的 href 属性,并以  阅读全文
posted @ 2021-08-15 17:03 陌路y
摘要:html文件乱码一般是因为编码格式不匹配造成的,比如:不同编码内容混杂、浏览器不能自动检测网页编码等等;但无论是哪种情况造成乱码,在html文件头中设置网页编码,匹配好编码格式就可。 下面是一个中文乱码的html: <!DOCTYPE html> <html> <body> <h1>标题</h1> 阅读全文
posted @ 2021-08-15 17:01 陌路y
摘要:给大家整理了 25 个前端相关的学习网站和一些靠谱的小工具,包括一些小游戏、教程、社区网站和博客,以及一些资源网站,希望可以帮助到大家! css 相关 1. css Battle - 在线比拼 CSS https://cssbattle.dev 在线比拼 CSS ,一个挺有趣的竞争性游戏,一共有12 阅读全文
posted @ 2021-08-15 17:00 陌路y
摘要:概念 Responsive design,意在实现不同屏幕分辨率的终端上浏览网页的不同展示方式。通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验。 步骤 1. 设置 Meta 标签 大多数移动浏览器将html页面放大为宽的视图(viewport)以符合屏幕分辨率,可以使用视图的meta标 阅读全文
posted @ 2021-08-15 16:59 陌路y
摘要:响应式布局概念 Responsive design,意在实现不同屏幕分辨率的终端上浏览网页的不同展示方式。通过响应式设计能使网站在手机和平板电脑上有更好的浏览阅读体验。 经过不停地学习和实践,如今总结响应式设计的方法和注意点。其实很简单。 响应式设计的步骤 1. 设置 Meta 标签 大多数移动浏览 阅读全文
posted @ 2021-08-15 16:58 陌路y
摘要:很多人经常会对响应式布局和自适应式布局产生混淆,今天将为大家介绍这两者到底表示的是什么以及它们之间的区别。具有一定的参考作用,希望对大家有所帮助。 一:什么是响应式布局和自适应式布局 1.什么是响应式布局 响应式布局就是实现不同屏幕分辨率的终端上浏览网页的不同展示方式。通过响应式设计能使网站在手机和 阅读全文
posted @ 2021-08-15 16:57 陌路y