JS
关注
分享
扫一扫
Yetian_2000
这个作者很懒，什么都没留下…
展开
-
使用fetch请求解析服务端响应的数据
前端是：electron + react写的。后端代码：node.js 写的。原创 2023-02-09 17:47:57 · 292 阅读 · 0 评论 -
前端js中使字符串代码运行
js执行字符串脚本原创 2023-01-30 17:31:20 · 1674 阅读 · 0 评论 -
js创建svg元素并插入到html中使用createElementNS
动态创建svg在插入html中原创 2022-06-09 15:20:03 · 3509 阅读 · 0 评论 -
匿名函数使用Arguments.callee实现递归
函数实现递归是一个很就是函数内根据一定的条件不断的调用函数本身实现循环，但是这种递归有一个条件就是该函数必须有名字，如下可以实现一个没有名字函数的递归(function (b){ var x= b || 0; console.info(x); if (x<3) { arguments.callee(x+1); }})()其中arguments.callee是实现函数自己调用自己的关键...原创 2021-10-25 11:19:47 · 284 阅读 · 0 评论 -
完善开发流程
标准的开发流程：1.. 开需求会需要，根据细节点一个个过。不确定的点，后面确定了再开会确定（最好不要发邮件的形式）2.后台接口开发完了，需要和前端，核对功能接口文档。3.前端与后台都开发完了，需要讲解开发的功能。（项目经理与测试参与，查看功能是否准确）4.测试开用例评审，讲解测试用例。5.发测前，开发根据用例，自测功能。恒生开发流程需要完善的地方：1. 环境有问题，都是测试在弄，但总是要弄好久，出现了问题他们也不知道怎么回事。也不好定位出问题。（希望这些事后台来完成）2. 开发应该有自己原创 2021-10-08 15:05:18 · 273 阅读 · 0 评论 -
滚动踩的几个坑
不能写成contentH == (scrollTop + viewH)，存在兼容性问题，不同的浏览器。if(contentH - (scrollTop + viewH) < 10 ){}写成这样更加合理。2。scrollTop实现动画的缓慢滚动，这个不是css无法使用动画函数，所以只能通过定时器来实现。要监听某个元素的滚动，必须满足两个条件，第一：该元素必须设置了overflow，第二：该元素不能是body，否则使用$("#xx").scroll()监听不到滚动。...原创 2021-08-27 17:43:38 · 205 阅读 · 0 评论 -
postMessage，父传子的iframe示例（亲测有效）
父窗口<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><script src="./js/jquery.js" type="text/javascript"></script><script type="text/javascript"> function post(原创 2021-07-30 14:38:29 · 555 阅读 · 0 评论 -
小知识总结
姓名的：正则表达式 //真实姓名必须以汉字或字母开头，允许空格_-.·等字符 var pattern = /^[\u4E00-\u9FFFa-zA-Z][\u4E00-\u9FFF\w\_\-\.\·\s]{1,49}$/; var arr = pattern.test(str);v-decorator：antd表单的校验指令v-decorator这个哪来的自定义指令：antd表单的校验指令v-decorator的使用，这个可以双向绑定值。有点类似v-model，原创 2021-07-30 14:35:39 · 165 阅读 · 0 评论 -
canvas绘制瓦片地图示例
注意这里的图片需要自己加下，图片命名规则是x1y1 x1y2 x1y3 x2y1 x2y2 x2y3 x3y1 x3y2 x3y3 这样的9张图片<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><script src="./js/jquery.js" type="text/javascri原创 2021-07-30 11:14:28 · 1229 阅读 · 0 评论 -
前端复制内容到剪贴板
主要分一下几步1、创建一个文本域节点var textArea = document.creatElement(‘textarea’);2、把要复制的内容插入到上面创建的文本域节点里textArea.textContent = “我是被复制的内容”;3、设置创建的文本域节点styletextArea.style.position = ‘fixed’;4、把创建的文本节点插入到body里document.body.appendChild(textArea);5、选择创建的文本域节点textA原创 2021-04-30 15:35:01 · 917 阅读 · 1 评论 -
localstorage与storage事件监听
引用《h5移动web开发指南》上的话：“当同源页面的某个页面修改了localStorage,其余的同源页面只要注册了storage事件，就会触发”所以，localStorage storage的例子运行需要如下条件：1. 同一浏览器打开了两个同源页面（同源页面：即同一个电脑里面的同一个文件夹，里面的不同的html页面）2.其中一个网页修改了localStorage（A页面修改了localstorge）3. 另一网页注册了storage事件（B页面能监听到变化）参考代码地址：暂无...原创 2021-02-23 15:28:28 · 599 阅读 · 0 评论 -
http与https的区别
1111原创 2021-01-13 15:42:25 · 139 阅读 · 0 评论 -
vue-i18n的国际化缩减版示例（真实有效）
<!DOCTYPE html><html><head><meta charset="utf-8"><title>Vue-i18n国际化缩减版</title><script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script><script src="https://unpkg.com/vue-i18n/dist/vue-i原创 2021-01-05 15:05:59 · 242 阅读 · 0 评论 -
vue-i18n使用文档
文档地址：https://www.bookstack.cn/read/vue-i18n-8.x/spilt.2.4e9cded0cfe86bd2.md#mergeLocaleMessage(%20locale,%20message%20)原创 2021-01-04 19:58:42 · 3102 阅读 · 0 评论 -
Cookie 和 Session 的区别(加入了我的思维理解)
A: Cookie 和 Session 的区别：安全性： Session 比 Cookie 安全，Session 是存储在服务器端的，Cookie 是存储在客户端的。存取值的类型不同：Cookie 只支持存字符串数据，想要设置其他类型的数据，需要将其转换成字符串，Session 可以存任意数据类型。有效期不同： Cookie 可设置为长时间保持，比如我们经常使用的默认登录功能，Session 一般失效时间较短，客户端关闭（默认情况下）或者 Session 超时都会失效。存储大小不同：原创 2021-01-04 14:37:03 · 192 阅读 · 0 评论 -
本文注意2点：1. URL的derevokeObjectURL方法 2 .如何给后台下载的文件重命名 ，3.blob对象的使用
URL.revokeObjectURL() 静态方法用来释放一个之前已经存在的、通过调用 URL.createObjectURL() 创建的 URL 对象。当你结束使用某个 URL 对象之后，应该通过调用这个方法来让浏览器知道不用在内存中继续保留对这个文件的引用了。使用场景示例：下面代码是一个文件下载的功能，做了一个请求，服务器返回文件对象。但没有和以前的文件下载一样：以前文件下载只要给个下载地址，我们使用1. 标签加href=“下载的url”点击就可以，2.或者使用window.open(“下载的ur原创 2020-12-30 17:24:43 · 986 阅读 · 0 评论 -
函数式声明与函数表达式的区别
//函数声明式function greeting(){ console.log("hello world"); }//函数表达式var greeting = function(){ console.log("hello world"); }1.如果函数表达式声明的函数有函数名,那么这个函数名就相当于这个函数的一个局部变量,只能在函数内部调用...原创 2020-12-30 11:21:16 · 181 阅读 · 0 评论 -
ztree多级组织都有checkbox，都是复选框，如何实现单选，并且不能牵连子节点
在ztree的setting中callback: { onCheck: this.zTreeOnCheck, } zTreeOnCheck(event, treeId, treeNode){ let nodeIds = Array.slice(this.value); //把复选框做成单选形式 if(treeNode.ch原创 2020-12-29 17:33:56 · 418 阅读 · 0 评论 -
ztree中请求树，追加XHR中的header参数
是在beforeSend这个钩子函数里面追加XHR中的header参数settings:{ async: { enable: true, type: 'post', contentType: "application/json", url:'https://baidu.com/org/scholl'原创 2020-12-25 15:49:56 · 1200 阅读 · 0 评论 -
浏览器控制台的headers中最底下的参数栏：Form Data与Query String Parameters
Form Data 是post请求才会出现的，Query String Parameters是get请求才出现，这两个都是请求体，只是请求方式不同，出现不一样原创 2020-12-12 15:40:59 · 2406 阅读 · 1 评论 -
Object.keys()循环处理对象
Object.keys()用于获得由对象属性名组成的数组，可与数组遍历相结合使用，非常好用。和for…in方法功能类似。对象使用了Object.keys()处理后，能使用数组处理的一些方法[ map（），forEach() , findIndex() ]。Object.keys(options).forEach(()=>{})...原创 2020-11-06 15:45:02 · 1056 阅读 · 0 评论 -
findIndex() 方法
findIndex(fn) 方法 : （注意：1.不需要return 2.参数fn就是检索条件 ）返回 在数组中查找符合条件第一个元素的index索引。var arr=[12, 16, 18, 20]let index = arr.findindex((item)=>{ item >= 18})// 打印index为2...原创 2020-11-06 11:32:20 · 17099 阅读 · 1 评论 -
window.requestAnimationFrame 与window.onresize的区别
1. window.requestAnimationFrame语法：window.requestAnimationFrame( callback )window.requestAnimationFrame() 告诉浏览器——你希望执行一个动画，并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数，该回调函数会在浏览器下一次重绘之前执行。（在前端开发的 web页面嵌入C++开发的视频客户端，针对移动浏览器窗口计算客户端位置会用到）需要注意的是：1.电脑屏幕是1原创 2020-11-06 11:17:32 · 323 阅读 · 0 评论 -
location.origin
window.location.origin这个获取url中包含了端口（域名或ip+端口），不需要再另外添加端口window.location.port原创 2020-11-03 14:19:14 · 2872 阅读 · 0 评论 -
前端接口有关需要注意问题
组件中与接口有关的都需要做判空，异常 处理（接口返回为空，错误处理）接口封装需要，做超时，异常，失败，等情况处理。原创 2020-11-03 01:45:17 · 352 阅读 · 0 评论 -
ztree点击节点会有一个底色变白的效果（如何阻止这个变白效果）
方法：设置回调ztreeBeforeOnClick，并return false setting: { check: { enable:true, chkStyle: "checkbox", chkboxType: {"Y":"ps","N":"ps"}, }, data: { simpleData: { enable: true, pI原创 2020-10-23 17:00:02 · 574 阅读 · 0 评论 -
ztree能构建树的数据（亲测可用）：
能构建树的数据（亲测可用）：<div class="search-input marginb"> <Input-search v-model.trim="searchValue" @on-search="searchTreeNode" placeholder="搜索..."></Input-search> <div class="ztree" id="tree"> </div> </div> set原创 2020-10-23 13:43:46 · 157 阅读 · 0 评论 -
在rtsp播放视频：前端web页面嵌入C++（开发的客户端）------前端与客户端交互是使用websocket技术来实现双向通信。
阮一峰的websockt日志：http://www.ruanyifeng.com/blog/2017/05/websocket.html?utm_source=tuicool&utm_medium=referral主要使用技术点：var ws = new WebSocket("wss://echo.websocket.org");ws.onopen = function(evt) { console.log("Connection open ..."); ws.send("He原创 2020-10-20 17:20:12 · 386 阅读 · 0 评论 -
rtsp播放视频，点击打点信息列表（视频直接跳转到打点位置）
// 点击目录索引（渲染的列表上绑定点击事件）, // 这个item主要携带的参数是timePoint ，需要传递给客户端，调取视频 skipTime(item) { this.seekVideo({ seekSecond: item.timePoint }) },// function 跳转打标位置 seekVideo(param) { var player = this.player player && player.DPSDK_.原创 2020-10-20 14:38:59 · 422 阅读 · 0 评论 -
rtsp播放视频：前端web页面嵌入C++（开发的客户端）----下篇
最后一步就是：执行player && player.DPSDK_OpenVideos(videoParams)方法，播放视频：关键在于提供一下videoParams里面相关的参数。（可能需要通过接口获得）var videoParams = { 'mode': 2, // 模式，int，1-预览（直播）,2-回放（点播） 'url': url, // 带token的rtspurl，string 'playSeed': timeNum原创 2020-10-20 11:33:43 · 402 阅读 · 0 评论 -
rtsp播放视频：前端web页面嵌入C++（开发的客户端）----上篇
这种方式播放视频的优点：实时性好。技术难点在于：前端和C++客户端的交互。主要使用的插件，与技术：DPSDK_VideoPlayer这个插件，需要下载这个js，这个js，客户端提供了一系列的方法供我们前端调用。如下：视频播放的流程：player.DPSDK_Init（）=====》player.DPSDK_Login（）=======》player.DPSDK_SetCallBack(cb)=====》展示位置 player.DPSDK_ShowModule(jsonParam) 与播放视频原创 2020-10-20 11:16:43 · 1261 阅读 · 1 评论 -
for...in 语句用于遍历数组或者对象的属性
举例子（Object）： obj={ studentName:'许版', temperature:37.1, attendanceDate:'2020/05/30 20:00:00', captureUrl:defaultImg, isOverTemp:"", channelName:'滨安路1187号', className:'班级A', studentCode:'', } // 处理数据，所有为null，空的，都返回原创 2020-10-16 15:23:40 · 332 阅读 · 0 评论 -
处理一个对象，如果有空值或者null，都转成“--”
obj={ studentName:'许版', temperature:37.1, attendanceDate:'2020/05/30 20:00:00', captureUrl:defaultImg, isOverTemp:"", channelName:'滨安路1187号', className:'班级A', studentCode:'', } // 处理数据，所有为null，空的，都返回“--” isExis...原创 2020-10-16 15:21:22 · 469 阅读 · 0 评论 -
for...of的理解与使用
for…of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句举例子：const array1 = ['a', 'b', 'c'];for (const element of array1) { console.log(element);}// expected output: "a"// expected output: "b"// expected原创 2020-10-16 15:05:13 · 447 阅读 · 0 评论 -
WebSocket
WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，**浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，**并进行双向数据传输。现在，很多网站为了实现推送技术，所用的技术都是 Ajax 轮询。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP请求，然后由服务器返回最新的数据给客户端的浏览器。这原创 2020-10-15 10:26:53 · 147 阅读 · 0 评论 -
Vue国际化（vue-i18n）
参考地址https://www.jianshu.com/p/df2550c6f1be一、安装三种方式：1、script引入<script src="https://unpkg.com/vue/dist/vue.js"></script> <script src="https://unpkg.com/vue-i18n/dist/vue-i18n.js"></script>2、npm安装 npm install vue-i18n3、yar原创 2020-10-13 20:00:40 · 175 阅读 · 0 评论 -
ivew组件＜Date-picker＞（使用遇到的坑）-----1
我在一个客户端嵌的web页面中遇到过这个问题：只使用了@on-change，删掉了 v-model=“query.beginTime”，导致日期在选日期时才能被赋值，遗漏了日期默认的显示日期。因为在点击查询按钮时，日期格式可能是ZT的时间格式，所以在提交时统一处理时间格式，而不需要在@on-change时去处理（因为在@on-change处理会遗漏不触发change事件时的默认的显示日期）<Date-picker tabindex="-1" type="datetime" .原创 2020-10-13 15:39:12 · 359 阅读 · 0 评论 -
给出图片路径，判断是否有效的图片路径，使用async与await，image.onload()
1111原创 2020-10-12 14:23:01 · 2333 阅读 · 0 评论 -
下篇-----合并对象方法： JSON.stringfy(JSON.parse(obj)）
这句话待严谨：javaScript存储对象都是存地址的，所以浅拷贝会导致 obj1 和obj2 指向同一块内存地址。改变了其中一方的内容，都是在原来的内存上做修改会导致拷贝对象和源对象都发生改变，而深拷贝是开辟一块新的内存地址，将原对象的各个属性逐个复制进去。对拷贝对象和源对象各自的操作互不影响。JSON.parse(JSON.stringify(obj))我们一般用来深拷贝，其过程说白了 就是利用JSON.stringify 将js对象序列化（JSON字符串），再使用JSON.parse来反序列化(还原原创 2020-10-10 17:48:33 · 281 阅读 · 0 评论 -
上篇-----合并对象方法总结：$.extend(), Object.assgin(), JSON.stringfy(JSON.parse(obj)）
jQuery.extend() 函数用于将一个或多个对象的内容合并到目标对象。它将返回目标对象语法：1.$.extend( [deep ], target, object1 [, objectN ] ) //第一个参数为是否深拷贝，第二个参数为目标对象Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象语法：Object.assign(target, ...sources)...原创 2020-10-10 17:35:34 · 168 阅读 · 0 评论