![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
JavaScript
JavaScript
程序媛zcx
这个作者很懒,什么都没留下…
展开
-
js 实现导入导出功能(FileSave.js)
点击导出按钮弹出文件框导出文件,点击导入选择文件获取文件数据,以下我保存的是json。原创 2023-07-18 10:20:35 · 2108 阅读 · 0 评论 -
html、css、原生js 构建移动端页面简单功能,切换页面、下拉框联动,模拟数据列表渲染、自定义弹框等
html、css、原生js 构建移动端页面,简单功能,页面显示隐藏、下拉框联动,模拟数据列表渲染、自定义弹框等原创 2023-04-04 14:09:57 · 623 阅读 · 1 评论 -
js 实现点击按钮选择文件,上传文件,获取进度
UI框架 layui 、jquery 实现点击按钮选择文件,上传文件,获取进度条。原创 2023-03-30 16:06:41 · 1729 阅读 · 0 评论 -
js 实现选择图片,预览,上传功能
js选择图片,预览,上传功能。原创 2022-12-26 16:32:51 · 1193 阅读 · 0 评论 -
js 获取 img src 请求地址的响应头 response header,(URL.createObjectURL()、URL.revokeObjectURL())
对象,就是二进制数据,比如通过new Blob()创建的对象就是Blob对象.又比如,在XMLHttpRequest里,如果指定responseType为blob,那么得到的返回值也是一个blob对象.方法会根据传入的参数创建一个指向该参数对象的URL. 这个URL的生命仅存在于它被创建的这个文档里. 新的对象URL指向执行的File对象或者是Blob对象.通过返回的图片二进制数据来创建一个对象URL. 把URL 赋给 img 的 src。指定返回的数据格式为blob二进制数据.原创 2022-09-26 14:49:32 · 2325 阅读 · 0 评论 -
js 字符串中只保留数字replace()
replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。语法stringObject.replace(regexp/substr,replacement)参数 描述 regexp/substr 必需。规定子字符串或要替换的模式的 RegExp 对象。 请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象。 replacement 必需。一个字符串值。规定原创 2021-12-03 15:23:43 · 9512 阅读 · 0 评论 -
前端 js 使用 MJPG-Streamer 播放直播视频
MJPG-Streamer最近使用 MJPG-Streamer 来 播放 直播视频,前端 只需要拿到 地址 添加到 img 的 src 上即可网络要求较高,一直在请求数据,我测试 54分钟传输2.8G数据。需要展示多个,可以把这个当源 用 canvas 绘制视,或者是再创建 img 标签let url = 'http://' + FileIP + ':9999/?action=stream';$('body').append("<img src='"+ url +"' widt原创 2021-11-17 17:56:31 · 3033 阅读 · 1 评论 -
js 前端ajax发送json数据、C++ CJsonObject 接收处理数据示例
// 一条json数据结构示例:let data = { "id": 1, "param": { "cid": 1, "obj1": [ { "id": 1, "name": "一" }, { "id": 2, "name": "二" ...原创 2021-11-12 13:55:40 · 1709 阅读 · 0 评论 -
js 数组操作 以固定位数 为一组 循环数组
let obj = [{"gid": 1, "id" : 1, "len" : 0}, {"gid": 1, "id" : 2, "len" : 2}, {"gid": 2, "id" : 1, "len" : 0}];let arr = [1, 1, 5, 1, 2, 12, 2, 1, 22];// 循环数组 3个数为一组循环(1:gid 2:id 3:len)for(let i = 0;i < arr.length; i+=3) { console.log(arr[i]); .原创 2021-11-12 11:25:06 · 1198 阅读 · 0 评论 -
js已知一个元素值,在数组中找到与它相差最小的元素值
例如下面数组,传5 应该找3 、传7应该找6方法一:let arr = [2, 1, 6, 3, 9, 8];function findId(id) { let rId = 0; for (let i = 0; i < arr.length; i++) { if (rId < arr[i] && arr[i] < id) { console.log(id, arr[i]) rId .原创 2021-09-01 15:14:01 · 1135 阅读 · 0 评论 -
js 处理接收到的二进制数据ArrayBuffer
服务器数据可能是文本,也可能是二进制数据(blob对象或Arraybuffer对象),下面是我连接websoket 收到的数据:Blob对象表示一个不可变、原始数据的类文件对象。它的数据可以按文本或二进制的格式进行读取,也可以转换成ReadableStream来用于数据操作。ArrayBuffer对象用来表示通用的、固定长度的原始二进制数据缓冲区。1、我先设置接收为ArrayBufferwebsocket.binaryType = 'arraybuffer';...原创 2021-08-24 17:24:38 · 2905 阅读 · 1 评论 -
css 实现自定义遮罩层模态框
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>html、css自定义实现模态框遮罩层</title> <style> html,body { width: 100%; height: 100%; margin: 0; .原创 2021-07-15 17:48:38 · 1287 阅读 · 0 评论 -
C++ sprintf 格式化 日期时间 页面访问json数据
vector<int> list = {2021, 6, 16, 17, 5, 40};char buf[100];sprintf(buf, "%d-%02d-%02d %02d:%02d:%02d", list[0], list[1], list[2], list[3], list[4], list[5]);CJsonObject je;je.Add("timeStr", buf);je.AddEmptySubArray("time");for(int i = 0;i<...原创 2021-06-16 17:27:33 · 769 阅读 · 0 评论 -
ES6中Set使用,判断数组里是否有相同的元素
let arr = [1,2,3,4,5];if(new Set(arr).size !== arr.length){ console.log("有相同的元素--------Yes");} else { console.log("没有相同的元素------No");}原创 2021-06-15 17:56:42 · 5252 阅读 · 0 评论 -
js实现字符串隔4位或隔2位 添加符号(空格、- 等)
1、每隔4位添加 -var data = "1254856332111122klklhh";var result = "";for(let i = 0; i < data.length; i++) { if (i % 4 == 0 && i != 0) { result += '-' + data[i]; } else { result += data[i]; }}console.log(result);..原创 2021-05-25 13:59:32 · 6149 阅读 · 0 评论 -
js、jquery实现多个div绑定点击事件,点击一个div使边框选中,其他div取消边框选中
效果:代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>点击边框选中,取消其他选中</title> <style> div { width: 100px; height: 100px; backgrou..原创 2021-03-18 17:06:14 · 2489 阅读 · 0 评论 -
js 使用HTML5 Websoket通信,发送和接收数据案例代码
HTML5 WebSocketWebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。在 WebSocket API 中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。原创 2021-03-03 15:25:24 · 6489 阅读 · 1 评论 -
js 实现单击、双击事件
js 实现绑定按钮单击、双击事件:<button id="clickBtn1">单击/双击按钮1</button><button onclick="btnClick()" ondblclick="btndbClick()">单击/双击按钮2</button> // 方法一 var clickBtn = document.getElementById("clickBtn1"); clickBtn.onclick = funct原创 2021-03-03 13:24:53 · 16012 阅读 · 0 评论 -
js/jquery 实现文字一秒随机变换文字颜色效果
<span id="blink"> 文字1秒随机变换颜色 </span>function changeColor() { var colors = ["#f00", "#0f0", "#00f", "#880", "#808", "#088", "yellow", "green", "blue" , "gray"]; document.getElementById('blink').style.color = colors[parseInt(Math.rand.原创 2021-03-03 11:28:47 · 1921 阅读 · 1 评论 -
js、jquery监听输入框input获取、失去焦点事件focus、blur
onfocus 事件在对象获得焦点时发生,通常用于 <input>、<select>、和<a>。onblur 事件会在对象失去焦点时发生。<input type="text" onfocus="myFocus()" onblur="myBlur()"><input type="text" id="name">1、js绑定input 3种方法var nameInput = document.getElementById("na..原创 2021-02-26 17:14:27 · 17730 阅读 · 3 评论 -
js 移动端阻止下拉滑动、刷新
阻止默认的处理方式(阻止下拉滑动的效果),阻止在移动端下拉刷新的效果 document.body.addEventListener('touchmove', function (e) { e.preventDefault(); }, {passive: false});原创 2021-02-26 16:36:22 · 4974 阅读 · 0 评论 -
js 移动端解决input focus后键盘弹出,高度被挤压页面边形的问题
页面样式是采用的百分比布局,宽高都是百分百,横屏,竖屏有问题,先竖屏再横屏款高不对原创 2021-02-26 16:33:30 · 2264 阅读 · 1 评论 -
js判断移动端设备是横屏还是竖屏
判断移动端设备是横屏还是竖屏var viewWidth = window.innerWidth; //获取可视区域宽度 var viewHeight = window.innerHeight; //获取可视区域高度if (viewWidth > viewHeight) { // 宽大于高 横屏 console.log("横屏")} else { console.log("竖屏")}...原创 2021-02-25 15:20:08 · 869 阅读 · 0 评论 -
setTimeout 执行顺序案例理解,异步操作
测试代码 :console.log("111111111111");console.log("22222222222");setTimeout(function () { console.log("333333333");}, 100);setTimeout(function () { console.log("444444444");}, 0);console.log("55555555");输出顺序如下:1111111111112222222222255原创 2021-02-20 11:58:20 · 1139 阅读 · 0 评论 -
js 数据操作JSON.stringify() 和 JSON.parse()示例(请求返回json字符串处理)
1、JSON.stringify()方法用于将 JavaScript 值转换为 JSON 字符串。语法JSON.stringify(value[, replacer[, space]])参数说明:value: 必需, 要转换的 JavaScript 值(通常为对象或数组)。 replacer: 可选。用于转换结果的函数或数组。 如果 replacer 为函数,则 JSON.stringify 将调用该函数,并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回原创 2021-02-20 11:18:26 · 547 阅读 · 0 评论 -
js 使用 = 直接赋值数组,修改新数组时会把原数组修改掉的问题解决(深拷贝)
使用 = 直接赋值数组,修改新数组时会把原数组修改掉:let oldArr = [ {group: 1, id: 2, name: "aa"}, {group: 2, id: 1, name: "bb"}];let newArr2 = oldArr;for (let i = 0; i < newArr2.length; i++) { if (newArr2[i].id == 1) { newArr2[i].name = "new"; b原创 2021-02-19 17:54:09 · 2392 阅读 · 0 评论 -
js 清空数组 的方法
let list = [1, 2, 3]list.splice(0, list.length); // 方法一// list.length = 0; // 方法二console.log(list); // []原创 2021-02-19 17:46:53 · 650 阅读 · 0 评论 -
js 双for循环嵌套,找到两个数组中属性值都相同的数据, 添加到新数组
js 双for循环嵌套,找到arr2 中 group 和 id 与 arr1 中属性值都相同的数据, 添加到新数组let arr1 = [{group: 1, id: 2, name: "aa"}, {group: 2, id: 1, name: "bb"}, {group: 2, id: 2, name: "cc"}, {group: 3, id: 2, name: "dd"}];let arr2 = [{group: 1, id: 1, name: "ee"}, {group: 2, id: 2原创 2021-02-19 17:44:14 · 6102 阅读 · 0 评论 -
js 循环数组时,splice 删除数据注意的问题
js i++循环数组时,splice 删除数据没有i-- ,得到的数据错误:let rId = 2;let list = [{id: 1, name: "a"}, {id: 4, name: "d"}, {id: 3, name: "c"}, {id: 2, name: "b"}];// 去掉 id 大于 2 的数据for (let i = 0; i < list.length; i++) { if (list[i].id > rId) { list.spl原创 2021-02-19 17:41:10 · 1400 阅读 · 0 评论 -
js 循环对象数组,根据某个属性值操作数据(示例为删除操作)
let rId = 2;let list = [{id: 1, name: "a"}, {id: 4, name: "d"}, {id: 3, name: "c"}, {id: 2, name: "b"}];// 去掉 id 等于 2 的数据for (let i = 0; i < list.length; i++) { if (rId == list[i].id) { list.splice(i, 1); break; // 有多个 id值 等于2时 .原创 2021-02-19 17:33:04 · 1451 阅读 · 0 评论 -
js 操作对象数组,多个相同属性值时进行判断
arr数组中,有多个相同的group,我想计算一共有几个组,组号变化时 groupNum 加1,并把组号添加到数组。var arr = [ {name: 'a1', group: 1}, {name: 'b1', group: 1}, {name: 'c1', group: 1}, {name: 'd1', group: 1}, {name: 'a2', group: 2}, {name: 'b2', group: 2}, {name: 'c2'原创 2021-02-19 17:23:52 · 1836 阅读 · 0 评论 -
js实现 localStorage 存取数据、移除(变量或json数据)
1、localStorage中 存 port 和 取 port 值,代码如下:var port = 8080;localStorage.setItem("port", port);var localPort = localStorage.getItem("port");console.log(localPort); // 80802、localStorage中 存 json数据data 和 取 json数据data,代码如下:var data = [{"id":1,"name":.原创 2021-02-19 17:16:19 · 4354 阅读 · 2 评论 -
js 实现无符号数和有符号数转换
项目中,x坐标传的是负数 -1 ,再获取x坐标数据时返回了一个很大的数 4294967295 ,想在前端处理需要把无符号数转成有符号数,代码如下:var x = 4294967295 << 0; // << 0 无符号数转换为有符号数console.log(x); // -1var signed = -10;var unsigned = signed >>> 0; // >>> 0 转换为无符号数console.log(u.原创 2021-02-19 17:07:11 · 2557 阅读 · 0 评论 -
css、js实现进度条
css、js实现进度条代码如下:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>css 实现进度条</title> <style> .myProgress { width: 100%; background-color: #e2e2e2;.原创 2021-02-19 17:02:00 · 500 阅读 · 0 评论 -
js 实现对象数组中根据属性值去重(相同属性值只保留一个)
方法一:es5冒泡排序法,去重arrhttps://www.jianshu.com/p/7c12cbaa817bvar planData = [{"planid": 1, "planname" : "预案一", "scenesort": 3, "sceneid" : 2}, {"planid": 2, "planname" : "预案二", "scenesort": 2, "sceneid" : 1}, {"planid": 2, "planname" : "预案二", "scene.原创 2021-02-19 11:39:48 · 4206 阅读 · 0 评论 -
js 进制转换(toString() 、 parseInt() 、String.format封装)
js 任意进制转换方法如下:一、JavaScripttoString()方法1、定义和用法数字的字符串表示。例如,当 radix 为 2 时,NumberObject 会被转换为二进制值表示的字符串。2、语法number.toString(radix)3、参数值参数 描述 radix 可选。规定表示数字的基数,是 2 ~ 36 之间的整数。若省略该参数,则使用基数 10。但是要注意,如果该参数是 10 以外的其他值,则 ECMAScript 标准允许实现返回任..原创 2021-02-18 17:55:41 · 4122 阅读 · 0 评论 -
jquery 页面监听回车按下
js 页面监听回车按下事件:$(document).keydown(function (event) { if (event.keyCode == 13) { // 按下回车 }});原创 2021-02-18 10:17:28 · 1052 阅读 · 0 评论 -
js 监听浏览器窗口大小变化
监听浏览器大小变化window.addEventListener('resize', function() { // 变化后需要做的事 console.log("bianhuale=============="); })原创 2021-02-04 09:25:10 · 3448 阅读 · 0 评论 -
js 查看浏览器缩放比例,不是100% 则给出提示
查看浏览器缩放比例,不是 100% 则给出提示let rate = ChangeRatio();console.log("sr" + rate);if(rate != 100){ alert('当前页面不是100%显示,请按键盘ctrl+0恢复100%显示标准,以防页面显示错乱!');}function ChangeRatio() { var ratio = 0; var screen = window.screen; var ua = navigator.us原创 2021-02-04 09:23:50 · 1870 阅读 · 1 评论 -
js 浏览器禁止ctrl+ 鼠标滚轮上下缩放
js 浏览器禁止ctrl+鼠标滚轮上下缩放 window.addEventListener('mousewheel', function(event){ if (event.ctrlKey === true || event.metaKey) { event.preventDefault(); } },{ passive: false}); //firefox原创 2021-02-04 09:20:46 · 1761 阅读 · 0 评论