随笔分类 - Javascript
摘要:转自阮一峰http://www.ruanyifeng.com/blog/2019/08/web_components.html 组件是前端的发展方向,现在流行的 React 和 Vue 都是组件框架。 谷歌公司由于掌握了 Chrome 浏览器,一直在推动浏览器的原生组件,即 Web Componen
阅读全文
摘要:转自阮一峰http://www.ruanyifeng.com/blog/2019/02/npx.html npm 从5.2版开始,增加了 npx 命令。它有很多用处,本文介绍该命令的主要使用场景。 Node 自带 npm 模块,所以可以直接使用 npx 命令。万一不能用,就要手动安装一下。 $ np
阅读全文
摘要:转自http://www.ruanyifeng.com/blog/2019/09/cookie-samesite.html Chrome 51 开始,浏览器的 Cookie 新增加了一个SameSite属性,用来防止 CSRF 攻击和用户追踪。 一、CSRF 攻击是什么? Cookie 往往用来存储
阅读全文
摘要:1. 导读 你们是否也有过下面的想法? 重构一个项目还不如新开发一个项目... 这代码是谁写的,我真想... 你们的项目中是否也存在下面的问题? 单个项目也越来越庞大,团队成员代码风格不一致,无法对整体的代码质量做全面的掌控 没有一个准确的标准去衡量代码结构复杂的程度,无法量化一个项目的代码质量 重
阅读全文
摘要:一、说明 最近要做文件上传,在网上找了很久都没有一个全面的示例,特此记录下来分享给大家。 1.文件上传接口可按照springboot默认实现,也可用commons-fileupload组件,本示例使用springboot默认文件上传 2.最后也有commons-fileupload组件接口示例 2.
阅读全文
摘要:D3.js的v5版本入门教程(第十三章) 这一章我们来绘制一个简单的饼状图,我们只绘制构成饼状图基本的元素——扇形、文字,从这一章开始,内容可能有点难理解,因为每一章都会引入比较多的难理解知识点,在这里作者本人也只是粗略的讲解每个新知识点的意思!如果不是很理解的话,需要读者自行查看官网API 为了绘
阅读全文
摘要:D3.js的v5版本入门教程(第十二章) D3中提供了各种制作常见图形的函数,在d3的v3版本中叫布局,通过d3.layout.xxx,来新建,但是到了v5,新建一个d3中基本的图形的方式变了(我也并不知道是不是还叫布局,我觉得也可以这么叫,反正布局指的也是一个绘图函数) 下面是d3中一些常见的部分
阅读全文
摘要:D3.js的v5版本入门教程(第十一章) 与图形进行交互操作是很重要的!所谓的交互操作也就是为图形元素添加监听事件,比如说当你鼠标放在某个图形元素上面的时候,就会显示相应的文字,而当鼠标移开后,文字就会消失,或者鼠标单击一下某图形元素就会使它动起来 为了与图形元素进行交互操作,我们还是需要以下新的知
阅读全文
摘要:在这一章我们干点有趣的事——让我们上一章绘制的图表动起来,这样岂不是很有意思 为了让图表动起来,我们还是需要以下新的知识点 .attr(xxx) .transition() .attr(xxx),transition()表示添加过渡,也就是从前一个属性过渡到后一个属性.duration(2000),
阅读全文
摘要:D3.js的v5版本入门教程(第九章) 一个完整的柱状图应该包括的元素有——矩形、文字、坐标轴,现在,我们就来一一绘制它们,这章是前面几章的综合,这一章只有少量新的知识点,它们是 d3.scaleBand():这也是一个坐标轴,可以根据输入的domain的长度,等分rangeRound域(类比ran
阅读全文
摘要:D3.js的v5版本入门教程(第八章) D3中没有现成的坐标轴图形,需要我们自己用其他组件拼凑而成。D3中提供了坐标轴组件,使得我们在SVG中绘制一个坐标轴变得像添加一个普通元素那样简单 为了表绘制一个坐标轴,我们还是需要以下新的知识点 call()函数 定义一个坐标轴 坐标轴是有朝向的,在这里我们
阅读全文
摘要:D3.js的v5版本入门教程(第七章) 比例尺在D3.js中是一个很重要的东西,我们可以这样理解d3.js中的比例尺——一种映射关系,从domain映射到range域(为什么会是domain和range呢?等一下你就会看到,因为我们在建立比例尺是常常会用到domain()和range()两个函数,当
阅读全文
摘要:D3.js的v5版本入门教程(第五章) 1、选择元素 现在我们已经知道,d3.js中选择元素的函数有select()和selectAll(),下面来详细讲解一下 假设我们的<body>中有三个<p>,如下 <p>dog</p> <p>cat</p> <p>pig</p> <p>rat</p> 选择第
阅读全文
摘要:D3.js的v5版本入门教程(第三章) 在D3.js中,选择元素和绑定元素是最基本的内容,也是很重要的内容,等你看完整个教程后你会发现,这些D3.js教程都是在选择元素和绑定元素的基础上展开后续工作的 1、选择元素 在D3.js中,选择元素的函数有两个 d3.select() d3.selectAl
阅读全文
摘要:D3.js的v5版本入门教程(第四章) Update、Enter、Exit是D3.js中很重要的概念,下面来讲一下它们到底是什么?(当你看完后。你就会知道如果数据集个数和选择集个数不匹配的情况下使用data(),D3.js会怎么办) 在使用data()时,例如现在我们有一个数组[3,6,9,12,1
阅读全文
摘要:一、重见天日第二春 11年的时候,写了篇文章“web页面相关的一些常见可用字符介绍”,这篇文章里面藏了个好东西,就是使用一些空格实现个数不等的中文对齐或等宽。见下表: 字符以及HTML实体描述以及说明 这是我们使用最多的空格,也就是按下space键产生的空格。在HTML中,如果你用空格
阅读全文
摘要:为什么要写这篇文章 Sticky 也不是新知识点了,写这篇文章的原因是由于最近在实现效果的过程中,发现我对 Sticky 的理解有偏差,代码执行结果不如预期。决定写篇文章重新学习一次。 什么是 Sticky Sticky (MDN 翻译成粘性效果)是 CSS 属性 position 中的一个可选值。
阅读全文
摘要:如果想用fullcalendar实现排班功能,或者日历、日程功能。那么只需要简单的几步: 这里先挂官网链接: fullcalendar fullcalendar官网下载链接 一、下载及简单配置 1、这里先明确你想要的是哪种形式式:fullcalendar 提供多种日历形式: 你们可以在官网首页的演示
阅读全文
摘要:1.Function.apply.bind(…) 我在学习promise部分的时候遇到了这样的代码: Promise.resolve([10,20]).then(Function.apply.bind(function(x, y){ console.log(x, y); }, null)); //
阅读全文
摘要:alias 别名配置,配置之后可在模块中使用require调用 require(‘jquery’); seajs.config({ alias: { 'jquery': 'jquery/jquery/1.10.1/jquery' } }); define(function(require, expo
阅读全文

浙公网安备 33010602011771号