开发中使用到库中好用的方法和思路(框架)
1.serialize()和serializeArray() 序列化表单的元素的值,可以避免代码中频繁重复使用 dom获取表单元素的值!【Jquery提供】
2.有时候想要借助FormData()对象传递数组或者对象给后台,直接append到formdata中,后台接收会是[object object] 这种数据,没办法取到!
-------思路: 把对象或者数组使用 JSON.stringify(arr/obj) 转成json字符串,后再解析这个json字符串就可以拿到数据了!!!
3. 浏览器支持require关键字【nodejs】,使用 Require.js插件。【待进一步学习Require.js】
4.js实现文件下载的一个思路,方法中动态创建a标签,为a标签加上href和download属性后,模拟a的点击事件从而实现文件下载
var a = document.createElement('a');
console.log(a)
var event = new MouseEvent('click');
a.download = 'url';//这里除了是一个地址,还可以是一个Bolb对象 // url = URL.createObjectURL(url); // 创建blob地址 这里对于下载实现很重要! 这个属性也决定了下载的文件名!!!
a.href = url;
a.dispatchEvent(event); //触发a的点击事件!!!
————————————————
5.获取元素的各种属性的值:
windows.getComputedStyle(dom).left/top:里页面文档左侧和顶部的距离 【js原生】
windows.getComputedStyle(dom).width:dom元素宽度【js原生】
7. 延迟加载 script 标签 :使用 defer 关键字,可以使该脚本在dom解析完毕之后再加载!!!
8.对于直接写在标签里的事件(onclick等),传入的function中可以直接接收event参数【即为该点击事件对象!!!】,event.target就指向被点击的元素,跟dom绑定事件一样!!!
9.Swiper库【好用的轮播插件】,其中按照官网的教程,分页器效果不显示,【解决方案,安装 swiper@5.4.5】 版本, 最新版本使用方法有变化,【分页等功能需要结构语法单出导出,并挂载到Swiper上!!!】
~~~ 10. Canvas 生成视频,CanvasTovideo.js.
~~~ 11. js 实现屏幕录制。MDN官方文档提供的 MediaDevices.get() DisplayMedia() + MediaRecoder 等自带API可以实现!!!
~~~12. nodejs 使用 pm2 设置脚本开机自启。 使用: npm i pm2 -g | pm2 start app.js | pm2 save | pm2 startup
~~~ CRUD 自动生成工具 GfEasy
~~~
ES6 中 Object.keys(P),【首先会将P转成对象,无法转就报错】 几个特性:
- 返回的可枚举的属性
- 属性值是一个对象的,必须要设置 enumerable:true,才可以被监测到,默认 enumerable:false
- 可以继承属性
- 返回顺序,symbol当做key的,会被直接过滤掉, Number 为key的,并且大于0的,会排序返回,对于负数和小数,当做字符串处理,不进行排序。
- string为定义时顺序返回。
- Object.keys(123) => [], 因为 123 会被当做 Number('123') | new Number(123) => 返回的对象没有任何的属性值,所以返回空数组
- object.keys('123') => ['0','1','2'] ∵ :new String('123') => String{0:'1', 1:'2', 2:'3'}
- null 和 undefined 转换成对象都会报错!!!
~~~ RGB 转 16进制 =》 首先 正则表达式 匹配出 数字,然后使用 toString(16),传入16进制,得到16进制编码, 涉及到补零 就是用 padstart方法即可。
~~~evajs 游戏引擎 mojs css 动画调试工具库 imageGallery 相册插件
~~~Promise.then(v) => 这里的v 如果传入的是一个不是一个函数,那么其实就相当于同步代码!!!