- 博客(65)
- 资源 (5)
- 收藏
- 关注
RSS订阅
原创 Vue3.0 - 基本使用
JavaScript 与 TypeScript 的区别TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。安装：npm install -g typescript...
2021-11-21 20:25:43
1288
1
原创 webpack - 包构建工具从基础配置到打包发布
webpack是当前前端最热门的前端资源模块化管理和打包工具之一。基于node.js环境，提供前端模块化支持，代码压缩混淆，处理浏览器端JavaScript兼容性，性能优化等。项目中使用了webpack工具并且正常配置之后，我们就可以轻松使用模块化语法 import/export，less语法, es6转es5等等，让开发变得简单起来。webpack官方文档：概念 | webpack 中文文档注意，要安装webpack之前，必须保证电脑中已经安装了node.js。Node.js可以使用..
2021-11-13 17:27:51
1367
原创 JS模块化编程 - 一文看懂Common.js，AMD，CMD，ES6之间的区别和使用
你有没有像我一样，直接接触angular或vue等框架项目时， 觉得import 和 export这种友好的写法很好呀，傻乎乎的在自己的纯html+js页面中使用， 咦？ 怎么不好用呢？？？然后一搜索，就会出现它是ES6的语法， common.js规范， AMD和CMD之间的区别... (脑壳疼有没有)本文将带你拨开云雾见青天，来看看什么是JS模块化编程，以及常用的模块化编程规范及它们之间的区别。一. 模块化编程的诞生的原因随着互联网的迅速发展，网站逐渐变得越来越庞大，曾经前端被称..
2021-11-13 14:01:52
464
原创 VITE + VUE 全局环境变量使用相关知识
配置： 创建.env和.env.development，.env.production等配置文件，.env.uat, .env.test及其它均可。变量要以大写的VITE_开头， 如VITE_APP_NAME = 测试网站。注意事项： 默认先会去.env里找，然后根据当前环境去找。所以不区分环境的全局变量可以放在.env里，其它区分环境的全局变量可按环境来配置，变量名同名即可。使用： 在代码中 import.meta.env.VITE_APP_NAME即可。
2023-07-27 17:22:54
1033
原创 NVM - Nodejs的版本管理工具安装和使用
NVM全名：Node.js Version Management，nodejs的版本管理工具。通过它可以安装和切换不同版本的nodejs。下面列出下载、安装及使用方法。（当前仅在windows环境下安装）自动配置：1. 到GitHub上下载安装包Releases · coreybutler/nvm-windows · GitHub2. 下载解压好后一路下一步安装即可。3. 安装完成后我们可以点击【我的电脑-属性-高级-环境变量配置】， 来看一下默认安装nvm存放的...
2021-11-16 20:00:00
8690
原创 JavaScript - 字符串的一些常用方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2021-11-09 19:03:07
162
原创 JsBarcode - 生成条形码并打印出来
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
2021-11-09 18:54:07
1119
原创 JavaScript - 自执行匿名函数的N种写法
函数表达式(function expression) - 函数只有在var语句声明之后才能被调用函数声明(function declaration) - 函数可以在function声明之前被调用// 函数表达式var fn1 = function () { alert('函数表达式')}fn1();fn2();// 函数声明function fn2() { alert("函数声明")}自执行匿名函数 - 让一个函数声明语句变成了一个表达式,这种机制不会污...
2021-10-09 17:20:16
109
原创 css动画插件 - animation.css的基本使用
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>test</title> <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3...
2019-04-23 10:12:23
134
原创 SharePoint-JQuery增删改查
html:<link rel="stylesheet" href="../SiteAssets/bootstrap/bootstrap.min.css" type="text/css"><script src="../SiteAssets/Scripts/jquery-1.10.2.min.js" type="text/javascript"></script...
2019-04-18 17:03:47
95
原创 JavaScript- 数组对象根据相同对象分组
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X...
2019-04-08 14:33:46
1123
原创 CSS- 利用bootstrap完善表格之内容过多
表格中td的内容过多，希望通过省略号来表示， 当hover内容的时候，利用bootstrap tip提示信息， 展示出完整内容。 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" c
2019-03-14 11:07:15
632
原创 react-基础入门
环境搭建 1.电脑里必须装node.js 2.全局npm命令安装react环境 :npm install -g create-react-app 3.创建react项目demo :creat-react-app xxx(项目名) 4.启动react项目 :npm start目录结构 1.package.json 项目配置 2.public里面存放公共内容，主要...
2019-02-26 16:12:53
174
原创 JavaScript-简单的动画函数封装
可以控制元素left top width 发生变化时候 的动画// 根据样式名， 获得样式值 兼容所有浏览器function getStyle(obj, name) { if (window.getComputedStyle) { return getComputedStyle(obj, null)[name]; } else { ret...
2019-02-20 14:22:44
170
转载 [转]JavaScript-tools
转载自CSDN博客https://blog.csdn.net/zmylll/article/details/80069642 /* * 生成指定范围的随机整数 * @param lower 下限 * @param upper 上限 * @return 返回指定范围的随机整数，上/下限值均可取 */function random(lower, upper) { return ...
2019-02-20 14:19:52
168
原创 JavaScript-定时器解决卡顿问题- 键盘控制移动div
demo: 用键盘上下左右键子，控制div 上下左右移动。 不加定时器的时候会感觉移动的时候有卡顿现象， 可以通过定时器来解决。 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"
2019-02-20 10:27:57
1877
原创 JavaScript-setInterval() 定时器和setTimeout()延时器
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。从1 打印到10 每隔一秒打印一次。 // 定时器 var num = 1; var timer = setInterval(function...
2019-02-19 14:35:27
254
原创 JavaScript-BOM
BOM 指浏览器对象模型，可以通过js 操作浏览器。window -整个浏览器窗口 也是网页的全局对象navigator -浏览器信息location -浏览器地址栏信息，可以获取地址或者操作history -浏览器的历史记录 该对象不能获取到具体的历史记录， 只能操作浏览器向前 或者 向后。screen - 获取用户当前使用的显示器屏幕的相关信息navig...
2019-02-19 10:24:25
225
原创 JavaScript-addEventListener()
addEventListener() 方法用于向指定元素添加事件句柄。正常我们为一个标签元素绑定事件可以这么写:xxx.onclick=function(){}但当我们有同一个事件想绑定多个函数的时候， 上面的事件函数就会只执行最后的一个，前面的被覆盖掉。 此时可以选择用addEventListener这种方法来为标签绑定事件。注意:addEventListener() ie8及...
2019-02-18 17:13:29
383
原创 JavaScript-事件委派
当我们有一堆子标签有相同的事件的时候， 可以通过遍历子标签为其添加事件，但如果又新增了子标签元素， 事件就需要为新增的字标签元素重新绑定，否则无效。 例如: 我们有一个ul标签，一个button按钮。ul里面有几个li标签，为li里面的的a标签添加了点击事件， 当点击button按钮的时候， 向ul里面新增一个li。 <ul id="ul"> <li><...
2019-02-18 16:44:31
235
原创 JavaScript-事件冒泡
事件冒泡事件的向上传导，当后代元素上的事件被触发， 其祖先标签的相同事件也会被触发如果不需要发生事件冒泡可以通过事件对象来取消冒泡。 e.cancelBubble=true;例: 我们有一个div #box1 ， div里面有一个span标签 #span1.分别给#box1 和#span1以及body添加onclick点击事件， 此时，当我们点击#span1的时候， #box1和bo...
2019-02-18 16:17:34
112
原创 JavaScript-鼠标跟随
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
2019-02-18 15:58:48
263
原创 JavaScript-事件之onmousemove
onmousemove 监听鼠标移动事件。 注意，ie8及ie8以下监听不到event， 所以要用event=window.event;做一下兼容处理。 clientX/clientY获取当前鼠标在指定标签内的可见横纵坐标位置。标签.onmousemove=function(event){//兼容处理 if(!event){event=window.event;}// 或者// ...
2019-02-18 15:51:44
4789
原创 JavaScript-js操作标签style相关
JavaScript操作页面标签的样式。格式:设置页面标签的样式 el.style.样式=属性值.注意， style设置的的样式是内联样式， 优先级高。设置样式时，样式名称用驼峰方法命名的， 例如:border-radius 写成 el.style.borderRadius=“xxx”;设置样式 box1.style.width = "200px"; box1.sty...
2019-02-18 15:05:36
7516
原创 JavaScript-正则之String 对象方法
String()对象里面的split search match replace 这几个方法，经常配合正则表达式来使用。split() 拆分 将字符串拆分成数组 var str="gongtiantian"; console.log(str.split("")); // 根据任意字母去拆分 split(正则) console.log...
2019-02-14 16:05:37
128
原创 JavaScript-正则表达式基础
什么是正则表达式?正则表达式是由一个字符序列形成的搜索模式。当你在文本中搜索数据时，你可以用搜索模式来描述你要查询的内容。正则表达式可以是一个简单的字符，或一个更复杂的模式。正则表达式可用于所有文本搜索和文本替换的操作。文档基础写法xxx=new RegExp(“规则”,“匹配模式”)下面打印结果为true，因为str里面有a //匹配模式 i 表示忽略大小写， ...
2019-02-14 14:46:03
114
原创 JavaScript-Math对象方法之-用max求数组中的最大值
Math对象中的max()方法可以求出一组数字中的最大值。max()里的参数必须为数字，用逗号隔开，如:Math.max(1,2,3,4,5)如果想用Math.max()方法求数组中的最大值， 可以用apply()函数，第一个参数传递null， 第二个参数传递数组来实现。 var arr=[24,35,24,56,99]; var max=Math.max.apply(...
2019-02-14 10:54:20
2896
原创 JavaScript-Math对象方法之random随机数
Math是JavaScript的一个对象方法，里面包含了许多数学方法，非常方便。Math.random()会生成一个0-1之间的随机小数。 以下方法是分别生成0-n以内的随机数 和x-y以内的随机数。求0-n 以内的随机数， 包括0和nMath.round(Math.random()*n) //0-10 console.log(Math.round(Math.random()...
2019-02-14 10:50:09
1324
原创 JavaScript-arguments
在函数代码中，使用特殊对象 arguments，开发者无需明确指出参数名，就能访问它们。 arguments.length可以拿到当前函数传递过来的所有参数长度。arguments.callee 可以查看当前函数。 arguments[i] 可以查看指定索引的参数。 function func(a,b,c){ console.log(a+b+c); console.log...
2019-02-14 09:25:51
113
原创 JavaScript-函数的call()和apply()方法
call()和apply()都是在特定的作用域中调用函数，等于设置函数体内this对象的值，以扩充函数赖以运行的作用域。一般来说，this总是指向调用某个方法的对象，但是使用call()和apply()方法时，就会改变this的指向。 function fun(){ console.log(this); } fun();上面，当我们调用fun(...
2019-02-14 09:21:05
160
原创 JavaScript-数组 concat() ,join(),reverse(), sort()
concat()方法， 可以连接两个或者多个数组，也可以直接将数组元素做为连接对象。 var arr1=["小李","小王"]; var arr2=["小明","小红"]; var arr3=["小丽"]; var newArr=arr1.concat(arr2,arr3,"
2019-02-13 16:53:18
454
原创 算法练习-数组去重
如果一个数组里面有很多重复的元素， 删除重复元素，每种元素只保留一个，返回新数组。思路：每一个元素和它后面的所有元素进行比较， 如果出现一样的，就从数组中删除掉后面的重复元素。 由于一样的被删除掉了，数组里的元素索引会提前1位， 所以再减一位，继续比较。用到for循环和数组splice()删除方法。 var arr=[1,2,3,4,6,4,3,2,1,8,8,8,8,8]; ...
2019-02-13 16:00:08
230
原创 JavaScript-数组-splice()删除元素
splice() 删除数组中的指定元素第一个参数表示开始位置的索引，第二个参数表示删除的数量，第二个参数以后的参数是从删除开始的位置后面新增的元素删除元素，两个参数 var arr=["1111","2222","33333","444","555","66666","777","888"]; console.log(&qu
2019-02-13 15:47:24
9169
1
原创 JavaScript-数组-slice截取
slice(start,end)从数组中提取指定元素 最多两个参数， 第一个是开始截取的索引， 第二个是结束截取的索引（包含开始索引，不包含结束索引) var newArr=arr.slice(1,4); 只有一个参数， 截取从这个参数为索引开始，一直到整个数组结束 var newArr=arr.slice(2); 如果传递一个负值， 从数组右边往前计算...
2019-02-13 15:35:25
1658
原创 JavaScript-遍历数组 forEach
在ie8以后，遍历数组除了用for循环，还可以使用forEach()方法。forEach （）方法中一共可以有三个参数。第一个参数为元素，第二个参数为索引,第三个参数为完整数组对象例 var arr=["1111","2222","33333","hello","world","66666","777","888"];
2019-02-13 15:23:00
698
原创 JavaScript-数组
在JavaScript中，数组是很常用的内建对象，一般用来存储数据。创建数组的方法1 var arr1=new Array(); arr1.push("张三"); arr1.push("李四");创建数组的方法2 var arr2=["aaa","bbb"];获得数组长度 数组.length修改数组某一项的值 shuzu[索引]=xxxx...
2019-02-13 15:06:00
105
原创 JavaScript-创建对象-工厂方法创建对象-构造函数创建对象对比写法
基本创建对象、工厂方法创建对象、构造函数创建对象。<script> // 创建对象 var obj1={ name:"张三", age:18, sayHello:function(){ console.log(this.name); } }...
2019-02-13 11:36:02
191
原创 JavaScript-构造函数创建对象(类)
使用工厂方法创建对象， 对象实例的类型都是Object，不容易区分对象。比如，创建一个人的对象， 和创建一个狗狗的对象，打印出来对象的类型都是Object， 很难区分。这种情况， 用构造函数方法创建对象， 就可以解决了。注意: 创建构造函数， 习惯首字母大写。构造函数和普通函数的区别:调用: 普通函数直接调用， 构造函数需要使用new关键字来调用。this: 1.当以函数的形...
2019-02-13 11:20:03
3573
html2canvas.js 将网页转换成canvas然后生成图片
2019-05-09
animate.css
2019-05-05
jQuery.print.js
2019-05-05
JsBarcode.all.min.js
2019-05-05
browser.min.js
2019-05-05
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人