Category Archives: JavaScript

js获取当前毫秒数

js获取当前毫秒数（+new date()） 前言 在看视频的时候发现老师获取当前日期的毫秒表示时使用了let t1 = +new date()的写法，起初没有明白代码的含义，经过测试发现为日期的毫秒表示； 详情 代码：

  解释： 经测试和查阅后得知**+new Date ()**相当于调用 Date.prototype.valueOf ()方法，返回的是当下的时间距离1970年1月1日0时0分0秒的毫秒数 获取当前时间毫秒数的方法 +new Date() new Date().valueOf() new Date().getTime() Date.parse(new Date()) 注意：精确到秒，会将后三位舍弃为0

  from:https://blog.csdn.net/Ldcrle/article/details/120002457

谁会拒绝一款开源的 3D 博客呢？

说到博客大家一定都不陌生，不管你是深耕职场多年的老鸟，还是在学校努力的小鸟，应该都有过一段 “装扮” 博客的经历，比如：放上喜欢的图片、添加炫酷的交互、换上 DIY 的博客主题等等。但不管再怎么 “打扮”，也跳脱不出平面的 “凡胎”。

今天 HelloGitHub 给大家带来的是一款开源的 3D 博客项目，实话说我第一次访问这个博客的时候都惊呆了，颠覆了博客的认知。进去后需要通过操控一辆 3D 的小汽车，自己 “找到” 文章才可以阅读，特别有意思！

VUE项目build报错的解决办法（ERROR in static/js/vendor.xxxxx.js from UglifyJs）

一直运行很好的项目突然build报错了，错误信息如下：

在 UglifyJs 的 github issues #78 找到了这样一个解决方案：由于 UglifyJs 只支持 ES5 而 element-ui 可能引入了一部分 ES6 的写法，所以导致 webpack 打包失败。issue 里最后给出的解决方案是用 beta 版本的Uglify-es 来代替 UglifyJs（Beta 版本引入了对 ES2015+）的支持。需要在前端工作目录下用执行命令 npm i -D uglifyjs-webpack-plugin@beta。 不过在尝试过后，发现 build error 的问题依然没有解决，在深入查找问题所在后，决定用 bable 来解析 element-ui， 要完成此操作只需要修改前端文件夹下的build/webpack.base.conf.js 文件即可，修改如下： 修改前

修改后

相当于将 element-ui 加入需要 babel 解析的包中。 之后再次执行 npm run build， build 成功。 转载自以下文章： 原文地址   from:https://blog.csdn.net/sing_sing/article/details/79146265

Vue中的scoped及穿透方法

外层 >>> 第三方组件 {
样式
}

vue安装scss

npm i sass-loader@7.3.1 -D
npm i node-sass@4.14.1 -D

HTML canvas strokeStyle 属性

 Canvas 对象 实例 绘制一个矩形。请用红色的笔触颜色：

尝试一下 » 浏览器支持 Internet Explorer 9、Firefox、Opera、Chrome 和 Safari 支持 strokeStyle 属性。 注意：Internet Explorer 8 及之前的版本不支持 <canvas> 元素。 定义和用法 strokeStyle 属性设置或返回用于笔触的颜色、渐变或模式。 默认值： #000000 JavaScript 语法： context.strokeStyle=color|gradient|pattern; 属性值 值 描述 color 指示绘图笔触颜色的 CSS 颜色值。默认值是 #000000。 gradient 用于填充绘图的渐变对象（线性 或 放射性）。 pattern 用于创建 pattern 笔触的 pattern 对象。   更多实例 实例 绘制一个矩形。使用渐变笔触：

  尝试一下 »   实例 用一个渐变笔触来写文本 "Big smile!"：

尝试一下 »    Canvas 对象   from:https://www.runoob.com/jsref/prop-canvas-strokestyle.html

HTML canvas lineWidth 属性

 Canvas 对象 实例 用宽度为 10 像素的线条来绘制矩形：

尝试一下 » 浏览器支持 Internet Explorer 9、Firefox、Opera、Chrome 和 Safari 支持 lineWidth 属性。 注意：Internet Explorer 8 及之前的版本不支持 <canvas> 元素。 定义和用法 lineWidth 属性设置或返回当前线条的宽度，以像素计。 默认值： 1 JavaScript 语法： context.lineWidth=number; 属性值 值 描述 number 当前线条的宽度，以像素计。    Canvas 对象   from:https://www.runoob.com/jsref/prop-canvas-linewidth.html

学习 HTML5 Canvas 这一篇文章就够了

一、canvas简介 ​ <canvas> 是 HTML5 新增的，一个可以使用脚本(通常为JavaScript)在其中绘制图像的 HTML 元素。它可以用来制作照片集或者制作简单(也不是那么简单)的动画，甚至可以进行实时视频处理和渲染。 ​ 它最初由苹果内部使用自己MacOS X WebKit推出，供应用程序使用像仪表盘的构件和 Safari 浏览器使用。 后来，有人通过Gecko内核的浏览器 (尤其是Mozilla和Firefox)，Opera和Chrome和超文本网络应用技术工作组建议为下一代的网络技术使用该元素。 ​ Canvas是由HTML代码配合高度和宽度属性而定义出的可绘制区域。JavaScript代码可以访问该区域，类似于其他通用的二维API，通过一套完整的绘图函数来动态生成图形。 ​ Mozilla 程序从 Gecko 1.8 (Firefox 1.5)开始支持 <canvas>, Internet Explorer 从IE9开始<canvas> 。Chrome和Opera 9+ 也支持 <canvas>。 二、Canvas基本使用 2.1 <canvas>元素

  ​ <canvas>看起来和<img>标签一样，只是 <canvas> 只有两个可选的属性 width、heigth 属性，而没有 src、alt 属性。 ​ 如果不给<canvas>设置widht、height属性时，则默认 width为300、height为150,单位都是px。也可以使用css属性来设置宽高，但是如宽高属性和初始比例不一致，他会出现扭曲。所以，建议永远不要使用css属性来设置<canvas>的宽高。 ###替换内容 ​ 由于某些较老的浏览器（尤其是IE9之前的IE浏览器）或者浏览器不支持HTML元素<canvas>，在这些浏览器上你应该总是能展示替代内容。 ​ 支持<canvas>的浏览器会只渲染<canvas>标签，而忽略其中的替代内容。不支持 <canvas> 的浏览器则 会直接渲染替代内容。 用文本替换：

  用 <img> 替换：

  结束标签</canvas>不可省 与 <img>元素不同，<canvas>元素需要结束标签(</canvas>)。如果结束标签不存在，则文档的其余部分会被认为是替代内容，将不会显示出来。 2.2 渲染上下文(Thre Rending Context) ​ <canvas>会创建一个固定大小的画布，会公开一个或多个 渲染上下文(画笔)，使用 渲染上下文来绘制和处理要展示的内容。 ​ 我们重点研究 2D渲染上下文。 其他的上下文我们暂不研究，比如， WebGL使用了基于OpenGL ES的3D上下文 (“experimental-webgl”) 。

  2.3 检测支持性 […]

canvas详细入门教程(1W字 吐血分享)

简单来说，canvas是HTML5中的标签，它是一个容器，可以使用JS在其中绘制图形或文字。
是一个可以使用脚本 (通常为JavaScript) 来绘制图形的 HTML 元素。例如，它可以用于绘制图表、制作图片构图或者制作简单的动画。主要聚焦于2D图形。

利用js实现 禁用浏览器后退

也是查找了好多资料才找到的，这种方式，可以消除 后退的所有动作。包括 键盘、鼠标手势等产生的后退动作。

  现在，我们项目中就使用了第三种方式。在常用浏览器中，都可以禁用了后退。

  mb里可以直接配置项禁用回退 wkeSetDebugConfig(webview, "backKeydownEnable", "0")   from:利用js实现 禁用浏览器后退 (jvbaopeng.com)