JavaScript
文章平均质量分 66
给迷迷糊糊的自己,留份笔记
飒小北
这个作者很懒,什么都没留下…
展开
-
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 · 8755 阅读 · 0 评论 -
webpack - 包构建工具从基础配置到打包发布
webpack是当前前端最热门的前端资源模块化管理和打包工具之一。基于node.js环境,提供前端模块化支持,代码压缩混淆,处理浏览器端JavaScript兼容性,性能优化等。项目中使用了webpack工具并且正常配置之后,我们就可以轻松使用模块化语法 import/export,less语法, es6转es5等等,让开发变得简单起来。webpack官方文档:概念 | webpack 中文文档注意,要安装webpack之前,必须保证电脑中已经安装了node.js。Node.js可以使用..原创 2021-11-13 17:27:51 · 1537 阅读 · 0 评论 -
JS模块化编程 - 一文看懂Common.js,AMD,CMD,ES6之间的区别和使用
你有没有像我一样,直接接触angular或vue等框架项目时, 觉得import 和 export这种友好的写法很好呀,傻乎乎的在自己的纯html+js页面中使用, 咦? 怎么不好用呢???然后一搜索,就会出现它是ES6的语法, common.js规范, AMD和CMD之间的区别... (脑壳疼有没有)本文将带你拨开云雾见青天,来看看什么是JS模块化编程,以及常用的模块化编程规范及它们之间的区别。一. 模块化编程的诞生的原因随着互联网的迅速发展,网站逐渐变得越来越庞大,曾经前端被称..原创 2021-11-13 14:01:52 · 480 阅读 · 0 评论 -
JavaScript - Jquery+Bootsrap纯前台 表格增删改查操作
界面: bootstrapJavaScript框架 :Jquery练习: 节点操作。效果图:在线查看源码:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="vie原创 2018-10-25 17:15:20 · 871 阅读 · 0 评论 -
JavaScript - 纯js写一个对表格的简单增删改查操作
功能: 新增表格数据, 修改表格数据, 删除表格数据。不完善区: 删除数据之后序号没有做处理 ,表单验证简单的提示警告, 没有文字提醒。界面:在线查看下面是代码:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <me原创 2018-10-25 10:06:11 · 2957 阅读 · 1 评论 -
JavaScript - 自执行匿名函数的N种写法
函数表达式(function expression) - 函数只有在var语句声明之后才能被调用函数声明(function declaration) - 函数可以在function声明之前被调用// 函数表达式var fn1 = function () { alert('函数表达式')}fn1();fn2();// 函数声明function fn2() { alert("函数声明")}自执行匿名函数 - 让一个函数声明语句变成了一个表达式,这种机制不会污...原创 2021-10-09 17:20:16 · 141 阅读 · 0 评论 -
[转]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 · 184 阅读 · 0 评论 -
JavaScript-定时器解决卡顿问题- 键盘控制移动div
demo: 用键盘上下左右键子,控制div 上下左右移动。 不加定时器的时候会感觉移动的时候有卡顿现象, 可以通过定时器来解决。 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"原创 2019-02-20 10:27:57 · 1907 阅读 · 0 评论 -
JavaScript-正则表达式基础
什么是正则表达式?正则表达式是由一个字符序列形成的搜索模式。当你在文本中搜索数据时,你可以用搜索模式来描述你要查询的内容。正则表达式可以是一个简单的字符,或一个更复杂的模式。正则表达式可用于所有文本搜索和文本替换的操作。文档基础写法xxx=new RegExp(“规则”,“匹配模式”)下面打印结果为true,因为str里面有a //匹配模式 i 表示忽略大小写, ...原创 2019-02-14 14:46:03 · 123 阅读 · 0 评论 -
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 · 2965 阅读 · 0 评论 -
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 · 189 阅读 · 0 评论 -
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 · 1371 阅读 · 0 评论 -
JavaScript-简单的动画函数封装
可以控制元素left top width 发生变化时候 的动画// 根据样式名, 获得样式值 兼容所有浏览器function getStyle(obj, name) { if (window.getComputedStyle) { return getComputedStyle(obj, null)[name]; } else { ret...原创 2019-02-20 14:22:44 · 185 阅读 · 0 评论 -
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 · 1175 阅读 · 0 评论 -
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 · 108 阅读 · 0 评论 -
JavaScript-事件冒泡
事件冒泡事件的向上传导,当后代元素上的事件被触发, 其祖先标签的相同事件也会被触发如果不需要发生事件冒泡可以通过事件对象来取消冒泡。 e.cancelBubble=true;例: 我们有一个div #box1 , div里面有一个span标签 #span1.分别给#box1 和#span1以及body添加onclick点击事件, 此时,当我们点击#span1的时候, #box1和bo...原创 2019-02-18 16:17:34 · 122 阅读 · 0 评论 -
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 · 126 阅读 · 0 评论 -
JavaScript-函数的call()和apply()方法
call()和apply()都是在特定的作用域中调用函数,等于设置函数体内this对象的值,以扩充函数赖以运行的作用域。一般来说,this总是指向调用某个方法的对象,但是使用call()和apply()方法时,就会改变this的指向。 function fun(){ console.log(this); } fun();上面,当我们调用fun(...原创 2019-02-14 09:21:05 · 169 阅读 · 0 评论 -
JavaScript-工厂方法创建对象
有的时候我们需要重复创建很多个对象,对象的属性都相同, 这个时候如果一个一个的创建, 就会写大量的代码。 这时,工厂方法创建对象就非常有必要了。所谓工厂方法,就是用函数的形势, 将传递进来的值加工再返回出去,这里将对象参数传递进来, 通过函数再将对象返回出去供调用。传统方法创建对象 /*创建对象*/ var obj={ name:"张三",...原创 2019-02-13 10:39:22 · 307 阅读 · 0 评论 -
JavaScript-创建对象
JavaScript创建对象有两种格式,var obj=new Object();obj.name=xxx;obj.age=xxx;var obj={name:xxx,age:xxx}var obj={ name:"张三", age:18, gender:"男", sayNam...原创 2019-02-13 10:33:54 · 173 阅读 · 0 评论 -
JavaScript-addEventListener()
addEventListener() 方法用于向指定元素添加事件句柄。正常我们为一个标签元素绑定事件可以这么写:xxx.onclick=function(){}但当我们有同一个事件想绑定多个函数的时候, 上面的事件函数就会只执行最后的一个,前面的被覆盖掉。 此时可以选择用addEventListener这种方法来为标签绑定事件。注意:addEventListener() ie8及...原创 2019-02-18 17:13:29 · 413 阅读 · 0 评论 -
JavaScript-事件委派
当我们有一堆子标签有相同的事件的时候, 可以通过遍历子标签为其添加事件,但如果又新增了子标签元素, 事件就需要为新增的字标签元素重新绑定,否则无效。 例如: 我们有一个ul标签,一个button按钮。ul里面有几个li标签,为li里面的的a标签添加了点击事件, 当点击button按钮的时候, 向ul里面新增一个li。 <ul id="ul"> <li><...原创 2019-02-18 16:44:31 · 254 阅读 · 0 评论 -
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 · 280 阅读 · 0 评论 -
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 · 4906 阅读 · 0 评论 -
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 · 7572 阅读 · 0 评论 -
JavaScript-枚举对象中的所有属性
枚举 for in 拿到对象中的所有属性以及对应的值, 如下:n是对象中每一个属性名,obj[n]是对应的属性值 var obj={ name:"gongtiantian", age:18, address:"china xxx" } for(var n in obj){ cons...原创 2019-02-12 15:50:03 · 709 阅读 · 0 评论 -
JavaScript-构造函数创建对象(类)
使用工厂方法创建对象, 对象实例的类型都是Object,不容易区分对象。比如,创建一个人的对象, 和创建一个狗狗的对象,打印出来对象的类型都是Object, 很难区分。这种情况, 用构造函数方法创建对象, 就可以解决了。注意: 创建构造函数, 习惯首字母大写。构造函数和普通函数的区别:调用: 普通函数直接调用, 构造函数需要使用new关键字来调用。this: 1.当以函数的形...原创 2019-02-13 11:20:03 · 3743 阅读 · 0 评论 -
JavaScript-创建对象-工厂方法创建对象-构造函数创建对象对比写法
基本创建对象、工厂方法创建对象、构造函数创建对象。<script> // 创建对象 var obj1={ name:"张三", age:18, sayHello:function(){ console.log(this.name); } }...原创 2019-02-13 11:36:02 · 205 阅读 · 0 评论 -
JavaScript-setInterval() 定时器和setTimeout()延时器
setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。从1 打印到10 每隔一秒打印一次。 // 定时器 var num = 1; var timer = setInterval(function...原创 2019-02-19 14:35:27 · 270 阅读 · 0 评论 -
JavaScript-数组 concat() ,join(),reverse(), sort()
concat()方法, 可以连接两个或者多个数组,也可以直接将数组元素做为连接对象。 var arr1=["小李","小王"]; var arr2=["小明","小红"]; var arr3=["小丽"]; var newArr=arr1.concat(arr2,arr3,"原创 2019-02-13 16:53:18 · 470 阅读 · 0 评论 -
JavaScript-BOM
BOM 指浏览器对象模型,可以通过js 操作浏览器。window -整个浏览器窗口 也是网页的全局对象navigator -浏览器信息location -浏览器地址栏信息,可以获取地址或者操作history -浏览器的历史记录 该对象不能获取到具体的历史记录, 只能操作浏览器向前 或者 向后。screen - 获取用户当前使用的显示器屏幕的相关信息navig...原创 2019-02-19 10:24:25 · 241 阅读 · 0 评论 -
算法练习-数组去重
如果一个数组里面有很多重复的元素, 删除重复元素,每种元素只保留一个,返回新数组。思路:每一个元素和它后面的所有元素进行比较, 如果出现一样的,就从数组中删除掉后面的重复元素。 由于一样的被删除掉了,数组里的元素索引会提前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 · 247 阅读 · 0 评论 -
JavaScript-数组-splice()删除元素
splice() 删除数组中的指定元素第一个参数表示开始位置的索引,第二个参数表示删除的数量,第二个参数以后的参数是从删除开始的位置后面新增的元素删除元素,两个参数 var arr=["1111","2222","33333","444","555","66666","777","888"]; console.log(&qu原创 2019-02-13 15:47:24 · 9265 阅读 · 1 评论 -
JavaScript-数组-slice截取
slice(start,end)从数组中提取指定元素 最多两个参数, 第一个是开始截取的索引, 第二个是结束截取的索引(包含开始索引,不包含结束索引) var newArr=arr.slice(1,4); 只有一个参数, 截取从这个参数为索引开始,一直到整个数组结束 var newArr=arr.slice(2); 如果传递一个负值, 从数组右边往前计算...原创 2019-02-13 15:35:25 · 1758 阅读 · 0 评论 -
JavaScript-遍历数组 forEach
在ie8以后,遍历数组除了用for循环,还可以使用forEach()方法。forEach ()方法中一共可以有三个参数。第一个参数为元素,第二个参数为索引,第三个参数为完整数组对象例 var arr=["1111","2222","33333","hello","world","66666","777","888"];原创 2019-02-13 15:23:00 · 733 阅读 · 0 评论 -
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 · 115 阅读 · 0 评论 -
JavaScript-正则之String 对象方法
String()对象里面的split search match replace 这几个方法,经常配合正则表达式来使用。split() 拆分 将字符串拆分成数组 var str="gongtiantian"; console.log(str.split("")); // 根据任意字母去拆分 split(正则) console.log...原创 2019-02-14 16:05:37 · 139 阅读 · 0 评论