JavaScript
关注
分享
扫一扫
⑥②
这个作者很懒，什么都没留下…
展开
-
在React18中使用createRoot代替render
在React18中使用createRoot代替renderimport * as ReactDOMClient from 'react-dom/client'; ReactDOMClient.createRoot(/*...*/); ReactDOMClient.hydrateRoot(/*...*/);什么是 root?root就是指向React渲染dom树的一个最上层的数据结构。在旧的API中，root是不透明的，因为我们将它连接到DOM元素，并通过DOM节点访问它，从来不暴露给用翻译 2022-04-16 09:26:34 · 3935 阅读 · 0 评论 -
学习esbuild构建工具
简介既然要学习如何使用esbuild，就说明已经知道，esbuild号称是打开了前端构建工具性能的新时代，最新流行的Vite也是使用esbuild进行了构建依赖。上图是使用不同的构建工具，构建10个three.js副本的bundle，包括sourcemap和minify压缩等操作，可以看出很明显差距。主要特点有哪些？不使用缓存进行快速构建 ES6和CommonJS模块 ES6模块的TreeShaking JavaScript和Go的API 支持TypeScript和JSX语法..原创 2022-04-12 11:04:03 · 1440 阅读 · 0 评论 -
如何在VScode工具中配置eslint代码检查并动态提示
ESLint 作为ECAMScript和JavaScript 代码识别检查工具，为我们在开发过程中提供了很大的帮助，也为我们在多人协作编程的时候，提供了统一的代码风格限制方式，减少了我们在多人编写并提交同一个文件的时候，尽量减少冲突的出现次数。如果只是一个人书写代码，也能为我们提供很好的代码规范。尽量在项目初始阶段就使用代码检查、代码风格的规范插件工具。使用npm安装ESLint首先是安装eslint的插件包npm install eslint --save-dev然后我们可以使用命令原创 2022-04-08 21:06:22 · 5427 阅读 · 0 评论 -
TypeError: this.cliEngineCtor is not a constructor，webstorm和eslint的版本纠结
在webstorm里使用eslint的时候，会提示 TypeError: this.cliEngineCtor is not a constructor ，这样的一个错误，知道应该是版本的错误，但具体版本怎么区别，eslint的版本和webstorm的版本原创 2022-04-01 11:00:06 · 8513 阅读 · 2 评论 -
小程序和H5页面如何实现图片的瀑布布局
瀑布布局使用绝对定位的形式，这里使用waterfall-js来获取计算后的图片项的位置大小等信息，可以看到最终的效果图，示例代码可以参考https://gitee.com/orz365/waterfall-js可以看到，图片上的图片等列的显示，都是不等高的，对于这种像流水一样的布局，可以称为瀑布流的布局，对于不同大小的图片，这种布局方式是一种不错的选择。我们使用一种js插件，waterfall-js插件，我们只要传入我们要展示的图片列表信息，它可以很快的计算出我们要展示的图片大小，并将图片的大.原创 2021-07-27 09:29:04 · 534 阅读 · 0 评论 -
Canvas学习，用Canvas画五子棋并进行简单判断输赢
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>五子棋</title> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0"> <styl...原创 2021-06-17 11:13:16 · 555 阅读 · 1 评论 -
grunt-babel中如何去掉use strict严格模式
InstallFor Babel 7.x and grunt-babel v8npm i --dev grunt-babel @babel/core @babel/preset-envFor Babel 6.x and grunt-babel v7$ yarn add --dev grunt-babel@7 babel-core babel-preset-env原创 2021-06-02 15:25:14 · 745 阅读 · 0 评论 -
js中json对象如何动态设置键值key来赋值
在开发中，后台传给前端的数据结构都是固定的，前端只要根据固定的key值来获取对象中的数据值就可以了。有时候页面需要对象数据也只需要最简单的定义对象属性的方法就可以了。比如说：var obj = {}// 第一种方法obj.name = 'cssjs.cn'// 第二种方法obj['age'] = 99obj['address'+'work'] = '南京' 这里要说一下第三种方法，也是es6中支持的一种方法，但现在对于开发方式众多前端开发来说，es6的语法已经可以用在了开发当中了。原创 2020-07-23 09:38:25 · 11271 阅读 · 1 评论 -
比较常用的几个富文本编辑器，CKeditor、KindEditor、TinyMCE、Simditor
CKeditor有4和5两个版本在维护，版本5支持模块开发，可以动态的加载需要使用的模块，优快云也在使用，对图片的操作很方便，可定制图片手动缩放、优化等。TinyMCE本文更新时最新版本为v1.4.3.3，更新时间为2016年5月18日。Ueditor本文更新时最新版本为v1.4.3.3，更新时间为2016年5月18日。KindEditor本文更新时最新版本为v4.1.11，更新时间为2016年3月31日。Simditor本文更新时最新版本为v2.3.28，更新时...原创 2020-07-18 09:29:29 · 4205 阅读 · 0 评论 -
ueditor如何改变图片大小等比缩放
缩放图片大小是在插件fiximgclick中，可以直接搜索fiximgclick或updateTargetElement来寻找下面的代码。8个角都可以进行等比缩放updateTargetElement: function () { var me = this; // 拿到图片的原始大小 var o_width = me.target.naturalWidth; var o_height = me.target.naturalHeight; // 计算出原始图.原创 2020-06-23 12:38:20 · 2787 阅读 · 0 评论 -
ueditor复制粘贴不带域名的本地图片时会自动加上域名
在使用ueditor上传图片到服务器时，有时候会返回不带域名的方式展示图片，再次进行复制剪切粘贴当前图片时，ueditor会自动带上当前环境的域名端口等信息。如何不让ueditor加上本地域名信息呢，一个解决办法就是让图片再次上传。找到ueditor的远程图片抓取事件回调catchremoteimage。这段标红的函数代码就表示所粘贴的图片是否是测试的，如果是测试的图片（比如本地图片等），都不会再次进行上传，我们只需要将return true 改成 return false 就可以将本地图片或是原创 2020-06-19 12:11:41 · 1161 阅读 · 1 评论 -
Date日期UTC、GMT、ISO、CST的关系
GMT（Greenwich Mean Time）格林尼治时间UTC（Coordinated Universal Time）协调世界时，又称世界统一时间、世界标准时间、国际协调时间。由于英文（CUT）和法文（TUC）的缩写不同，作为妥协，简称UTC。CST（China Standard Time）中国时间标准UTC和GMT表示的是时间标准，而ISO 8601是时间和日期的表示法，多种...原创 2020-04-27 14:30:07 · 2481 阅读 · 0 评论 -
微信小程序的request请求方法简单封装，并使用abort方法处理重复请求
Talk is cheap, Show me the code.在request请求的时候，通常会遇到前一个请求没有结束，就发起了一个新的请求，这个时候就要把先前同样的请求取消掉，也就是使用abort() 方法取消请求。下面的代码是对微信小程序的request请求简单的封装。/** * GET请求 * @param url 请求地址 * @param param 参数 * @...原创 2019-09-21 13:44:26 · 4750 阅读 · 0 评论 -
Spin.js旋转的加载动画
转载文章：http://www.gunjidan.com/html/frontpage/65_1.html转载 2014-10-20 22:40:10 · 1550 阅读 · 0 评论 -
JavaScript 操作 Cookie
转自：http://www.cnblogs.com/Darren_code/archive/2011/11/24/Cookie.htmlJavaScript 操作 Cookie 从事web开发也有些日子了，cookie 是个啥差不多能说明白，可是实际自己一上手操作就是得去搜索(你们懂的)，结果被鄙视了...所以就写一篇博文做为自己的学习笔记，嘿嘿，博客的好处在此体现出转载 2013-04-04 00:46:25 · 683 阅读 · 0 评论 -
动态分页展示效果（纯JavaScript编写，值得学习）
动态分页展示效果（纯JavaScript编写，值得学习）实例索引body{margin:0px;padding:0px;font-size:12px;font-family:Verdana, "微软雅黑";background:#2d3033;}img{border:0;}a{outline:none;}#box{width:918px;height:745转载 2012-07-26 15:27:09 · 1937 阅读 · 0 评论 -
JavaScript模拟小球落下
模拟小球落下 <!-- Begin function BrowserCheck() { var b = navigator.appName; if (b == "Netscape") this.b = "NS"; else if (b == "Microsoft Internet Explorer") this.b = "IE"; else t转载 2012-07-23 22:14:28 · 787 阅读 · 0 评论 -
JavaScript中的ActiveXObject对象
JavaScript中ActiveXObject对象是启用并返回 Automation 对象的引用。使用方法：newObj = new ActiveXObject( servername.typename[, location])ActiveXObject 对象语法有这些部分：其中newObj是必选项。要赋值为 ActiveXObject 的变量名。servername是必转载 2012-07-05 00:44:34 · 558 阅读 · 0 评论