草庐IT

前端库

全部标签

前端 | FormData 用法详解

前端|FormData用法详解介绍​FormData是Ajax2.0对象用以将数据编译成键值对,以便于XMLHttpRequest来发送数据。XMLHttpRequestLevel2提供的一个接口对象,可以使用该对象来模拟和处理表单并方便的进行文件上传操作​如果表单属性设为multipart/form-data,则会使用表单的submit()方法来发送数据,从而发送数据具有同样形式。FormData的主要用途有两个:将form表单元素的name与value进行组合,实现表单数据的序列化,从而减少表单元素的拼接,提高工作效率。异步上传二进制文件使用方法创建一个空的对象//当前为空varformD

前端性能测试必备测试工具

我们在使用网站过程中,经常会遇到慢的问题,为了找到原因,一般需要借助工具进行检测,通过工具,可以检测出前端站点加载资源的相关详细情况。  今天,就给大家介绍几款前端性能测试分析工具,结合性能测试工具,实现通过量化的方式测试网站中诸如首字节加载时间(timetofirstbyte)或者渲染时间等表现。其中有些工具还会检查资源是否被缓存,多个CSS或JS文件是否值得合并,最后自动给出前端性能优化改进建议报告,如果对你有用的话,欢迎收藏转发。 因此我建立了一个软件测试开发自学团,正在学习测试的小伙伴可以通过点击下面的小卡片 正在跳转https://jq.qq.com/?_wv=1027&k=3T9t

php许愿墙代码包括前端和后端部分

以下是一个简单的PHP许愿墙代码示例,包括前端和后端部分:前端HTML代码(index.html):许愿墙许愿墙姓名:愿望:后端PHP代码(wishwall.php):以上代码实现了一个简单的许愿墙功能。用户在前端页面填写姓名和愿望,点击提交后,后端PHP代码会将愿望以文本形式追加到一个名为"wishes.txt"的文件中,并在页面上重定向到许愿墙页面。你可以根据需要自行调整代码,例如添加数据库存储、显示已提交的愿望等。以下是添加数据库存储的PHP许愿墙代码示例:前端HTML代码(index.html):许愿墙许愿墙姓名:愿望:后端PHP代码(wishwall.php):connect_err

JQuery前端之操作JSON的方法

转自:微点阅读  https://www.weidianyuedu.com一、关于Json的数据格式从结构上看,所有的数据最终都可以分成三种类型:第一种类型是scalar(标量),也就是一个单独的string(字符串)或数字(numbers),比如“北京”这个单独的词。第二种类型是sequence(序列),也就是若干个相关的数据按照一定顺序并列在一起,又叫做array(数组)或List(列表),比如“北京,东京”。第三种类型是mapping(映射),也就是一个名/值对(Name/value),即数据有一个名称,还有一个与之相对应的值,这又称作hash(散列)或dictionary(字典),比如

前端框架前置学习(3) AJAX原理 XMLHttpRequest,Promise,简易axios函数封装

图片上传1.获取图片文件对象 //文件选择元素->change改变事件document.querySelector('.upload').addEventListener('change',e=>{   //1.获取图片文件   console.log(e.target.files[0])2.使用FormData携带文件 //2.使用FormData携带图片文件   constfd=newFormData()   fd.append('img',e.target.files[0])3.提交表单数据到服务器,使用图片的url网站 axios({    url:'http://hmajax.ith

前端报错:“Uncaught SyntaxError: missing ) after argument list“只是参数列表后面缺少 “)”?

报错"UncaughtSyntaxError:missing)afterargumentlist",字面翻译过来的意思:语法错误:参数列表后面缺少)。一直以为是少了一个小括号找了好久发现并不是据提示是参数列表的问题,找到文件中存在参数列表的地方。如下图所示真正的元凶找到了,参数少了一个对''”,错误代码r=`${res.data}style="width:100%"οnclick="getClick(${res.data})">`修改后r=`${res.data}style="width:100%"οnclick="getClick('${res.data}')">`tips:这只是其中一种引

前端使用websocket发送消息,建立连接(详细)。【前端】

序言今天来学习一下前端如何使用websocket发送消息1基础介绍1.1什么是WebSocketWebSocket是一种在单个TCP连接上进行全双工通信的协议,它可以让客户端和服务器之间进行实时的双向通信。与传统的HTTP请求不同,WebSocket使用了一个长连接,在客户端和服务器之间保持持久的连接,从而可以实时地发送和接收数据。在WebSocket中,客户端和服务器之间可以互相发送消息。客户端可以使用JavaScript中的WebSocketAPI发送消息到服务器,也可以接收服务器发送的消息。1.2代码示例下面是一个使用WebSocketAPI发送消息的代码示例:varsocket=new

前端 读取/导入 Excel文档

情况:需要通过Excel表,将数据导入到数据库,但是后台人员出差了,我又只会PHP,没用过node,所以只能前端导入Excel文件,然后循环调用后台的单条添加接口了。库:Excel.js(版本4.3.0)CDN地址:scriptsrc="https://cdn.bootcdn.net/ajax/libs/exceljs/4.3.0/exceljs.min.js">script>Excel.js中文文档:https://gitee.com/alan_scut/exceljs下面是动态Excel表单下面是file文件(Excel文件)获取到的对象:下面是代码中输出的需要插入的数据:代码:使用方法:

前端获取用户地理位置定位

前端获取用户地理位置定位前言1.js原生geolocation2.第三方地图3.微信小程序sdk定位uniapp使用:微信小程序使用:补充:1.小程序中的地图使用:2.小程序中用户拒绝授权后的处理:三种定位对比地图逆解析最后前言在很多的h5/小程序中都需要用到定位,特别是一些连锁店,充电站,共享类的业务。本期就前端如何获取用户定位做一个说明。1.js原生geolocation先决条件:需要https,否则运行会获取不到位置信息。或者换成的edge浏览器。由于这个api获取的经纬度不够准确,且由于受到浏览器兼容性的问题,用的比较少。js原生的方式其实就是利用了js的api:navigator。这

div设置圆角#前端

要在div元素上设置圆角,您可以使用CSS的border-radius属性。这个属性允许您指定元素的边角为圆角,可以将其应用于一个或多个边角。以下是一些示例代码:1.设置所有四个边角为圆角:div{border-radius:10px;/*设置所有四个边角为10px的圆角*/}2.分别设置每个边角的圆角半径:div{border-top-left-radius:10px;/*左上角圆角*/border-top-right-radius:20px;/*右上角圆角*/border-bottom-left-radius:30px;/*左下角圆角*/border-bottom-right-radius