js
关注
分享
扫一扫
桐溪漂流
一个web前端小菜鸟
展开
-
使用frp工具实现内网穿透
本文使用frp的docker镜像 + JSON格式配置，以http服务为例。原创 2024-11-14 16:08:59 · 435 阅读 · 0 评论 -
VR视图插件Pannellum的简单使用总结
Pannellum是一个可以利用全景图片来生成VR场景展示的插件。可以在VR看房等场景中进行使用原创 2022-09-22 19:10:10 · 3010 阅读 · 0 评论 -
原生js自定义slider滑块组件
通过鼠标事件和定位模拟滑块滑动原创 2022-03-24 10:23:55 · 4946 阅读 · 3 评论 -
WebSocket认识理解及简单使用
WebSocket认识WebSocket是一种全双工的通信协议，基于TCP协议，可以满足客户端和服务端双向通信需求。默认端口也是80和443，握手阶段采用http协议，与http有良好的兼容性。可以发送文本和二进制数据。无同源限制，客户端可以与任意服务器建立通信。WebSocket属性与方法// 利用 `WebSocket` 构造函数可以创建 指定url的 WebSocket 连接。const ws = new WebSocket('ws://ip:port/api_pat原创 2021-12-22 11:59:43 · 854 阅读 · 0 评论 -
angular12简单搭建项目的过程记录
ng全局安装最新发布版本安装npm install -g @angular/cli指定版本安装npm install -g @angular/cli@8.3.29查看当前版本ng --version注意：需要根据ng版本选择安装对应的node版本// Angular CLI: 12.2.2// Node: 14.16.0项目创建ng new admin-angular --skipTests=true --style=scss创建的项目中跳过了单元测试的创建原创 2021-09-28 12:01:44 · 1206 阅读 · 0 评论 -
angular中input、ngModelChange、valuesChange的监听情况
一个小小的输入框Input<div> testNameInput <input type="text" nz-input [(ngModel)]="testNameInput" (input)="testNameChange(testNameInput)"> testNameEventInput <input type="text" nz-input [(ngModel)]="testNameEventInput" (input)="testNameEvent原创 2021-07-23 10:11:57 · 3299 阅读 · 0 评论 -
用array的sort方法把已知的元素排列在数组的首位
sort排序会改变原数组的顺序，所以下面会用map进行数组浅拷贝const arr = ['a', 'f', '数字', 'd', 'man'];// 把数字排在第一位const arr_1 = arr.map(item => item).sort((a,b)=> a === '数字' ? -1 : 1);// 把数字排第一位，man排第二位const arr_2 = arr.map(item => item).sort((a,b)=> a==='数字' || a ==原创 2021-07-01 20:29:52 · 457 阅读 · 0 评论 -
文件上传简单整理
文件上传1. html部分<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>文件上传</title></head><body> &l原创 2021-01-29 14:54:31 · 114 阅读 · 0 评论 -
web前端文件下载方法整理
前端项目中总会碰到文件下载的功能，此处整理了几个常用的下载方法1、a标签下载，在地址后面可以追加参数，适合get请求<ahref="/api/downloadurl" download>下载</a>2、form表单下载，下面简单包装了一个方法，可以根据情况调整下载方法，传递参数/** * 文件下载 * @param {*} params { uid: '下载文件id', fileName: '文件名称' } */function downloadFile.原创 2021-01-29 14:21:34 · 1251 阅读 · 0 评论 -
自定义步骤条分享
最近做的项目技术栈用的是jquery+requirejs+handlebar+公司内部的一套ui库。ui库中关于步骤条的只有简单的样式，如果设置下一步的时候需要一个节点一个节点的去设置样式，所以封装了一个步骤条的构造，现分享一下。封装的步骤条可以实现的效果如下：一、横向-从左开始二、横向-从右开始三、纵向-从上开始四、纵向-从下开始五、以上四种是封装的步骤条...原创 2019-10-24 17:18:41 · 1598 阅读 · 0 评论 -
自定义功能件--分页
这个介绍的是项目中自己封装的一个分页的方法，用的技术也是构造函数。虽然有很多的分页插件，但是自己也是可以动手写一下的。好了，上代码。分页的构造函数代码common.js/** * 分页的构造函数 * @param { id:"容器id", pageSize:"每页的数据条数", totalCount:"总数", pageNum:"当前页数", clickChange:"点击切换事件"...原创 2018-09-05 23:28:01 · 218 阅读 · 0 评论 -
自定义表格拖拽
前段时间做的项目是一个老项目，前后端不分离的，而且技术也是非常旧，由于不想过多引入第三方的插件，就自定义了一些方法，其中就有这个表格拖拽的方法。废话不多说，上代码。/** * 表格拖动操作 *//** * 拖动设置 * @param { id:"boxId", dragDrop:"拖动释放的回调", action:"up/down默认的拖动添加方式，可以不填写" } option ...原创 2018-09-05 23:12:35 · 1075 阅读 · 0 评论 -
js事件处理机制的理解
1、js事件机制js中事件的发生包括捕获和冒泡两个阶段，两个阶段的传播顺序为捕获：从最外边父元素节点传递至发生事件的元素节点，即由外到内；冒泡：从发生事件的元素节点传递至最外边父元素节点，即由内到外；就像图中所画的那样，事件是先从最外层节点开始到事件节点的捕获阶段，然后从事件节点到最外层节点的冒泡阶段。但由于IE8及其低版本的浏览器不支持捕获事件，所以现在很多事件都是在冒泡原创 2017-07-11 10:16:27 · 3032 阅读 · 0 评论