Vue.js从零开始—

此博客中的热门博文

Web API从零开始——SVG

SVG 是我基本没有用过的知识块，所以这里也是边分享边学习，尽量在我自己理解的基础上来分享。 1 概念 SVG 是一种基于 XML 语法的图像格式，全称是可缩放矢量图（Scalable Vector Graphics）；其他图像格式都是基于像素处理的， SVG 则是属于对图像的形状描述，所以它本质上是文本文件，体积较小，且不管放大多少倍都不会失真。 SVG 文件可以直接插入网页，成为 DOM 的一部分，然后用 JavaScript 和 CSS 进行操作。上面是 SVG 代码直接插入网页的例子。 SVG 代码也可以写在一个独立文件中，然后用、、、等标签插入网页： < img src = "circle.svg" > < object id = "object" data = "circle.svg" type = "image/svg+xml" ></</span> object > < embed id = "embed" src = "icon.svg" type = "image/svg+xml" > < iframe id = "iframe" src = "icon.svg" ></</span> iframe > CSS 也可以使用 SVG 文件： . logo { background : url ( icon.svg ); } SVG 文件还可以转为 BASE64 编码，然后作为 Data URI 写入网页： < img src = "data:image/svg+xml;base64,[data]" > 2 语法 2.1 标签我们可以把 SVG 代码都放在顶层标签之中，下面是一个例子： < svg width = "100%" height = "100%" > ...

阅读全文

Node.js从零开始——事件、系统和流

毕竟不是一个真正的教程，这里主要还是以普及和介绍为主，所以这一部分就是 Node.js 的其他部分介绍了，主要也就是事件触发、操作系统以及流的知识。 1 事件触发器因为我们之前在浏览器中使用 JavaScript ，所以知道 JS 通过事件处理了许多用户的交互：鼠标的单击、键盘按钮的按下、对鼠标移动的反应等等。在后端， Node.js 也提供了使用 events 模块构建类似系统的选项。具体上，此模块提供了 EventEmitter 类，用于处理事件。使用以下代码进行初始化： const EventEmitter = require ( 'events' ); const eventEmitter = new EventEmitter (); 该对象公开了 on 和 emit 方法： emit 用于触发事件 on 用于添加回调函数（会在事件被触发时执行）例如，创建 start 事件，并提供一个示例，通过记录到控制台进行交互： eventEmitter . on ( 'start' , () => { console . log ( '开始' ); }); 当运行以下代码时： eventEmitter . emit ( 'start' ); 事件处理函数会被触发，且获得控制台日志。可以通过将参数作为额外参数传给 emit() 来将参数传给事件处理程序： eventEmitter . on ( 'start' , number => { console . log ( `开始 ${ number } ` ); }); eventEmitter . emit ( 'start' , 23 ); 多个参数： eventEmitter . on ( 'start' , ( start , end ) => { console . log ( `从 ${ start } 到 ${ end } ` ); }); eventEmitter . emit ( 'start' ,...

阅读全文