![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
javaScript
文章平均质量分 57
无语听梧桐
我姓同,所以叫无语听梧桐~
一名前端小白,不是计算机科班出身,偶然机会接触到前端编程,略感兴趣,就选择这条路。不知道在这条路上可以走多远,不过既然选择了,我会尽量选择多走一点!
展开
-
开发谷歌插件
入门谷歌插件一个谷歌扩展其实就是一个配置(入口)文件 manifest.json 和一系列 html、css、js、图片文件的集合manifest.json 说明{ // 插件的名称 "name": "测试插件", // 插件的描述 "description": "april的谷歌插件", "version": 0.1, "manifest_version": 2, // 图标位置 "icons": { "19": "icons/icon19.png",原创 2021-08-10 18:42:14 · 411 阅读 · 0 评论 -
document.cookie无法获取到cookie
背景在前后端联调的时候,后端需要在入参中传入 cookie。于是想通过 document.cookie 来获取,但是发现浏览器有 cookie 但是无法获取到。场景复现打开谷歌调试工具,可以看到浏览器中是有记录 cookie 的;在控制台执行 documen.cookie 发现获取不到[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Qrm2NS3T-1627532987813)(https://raw.githubusercontent.com/AprilTong/原创 2021-07-29 12:30:50 · 7062 阅读 · 2 评论 -
前端导出excel
xlsx 介绍由 SheetJS 出品的 js-xlsx 是一款非常方便的只需要纯 JS 即可读取和导出 excel 的工具库,功能强大,支持格式众多,支持 xls、xlsx、ods(一种 OpenOffice 专有表格文件格式)等十几种格式。也可以设置样式等。导出 excel 实现下载 xlsx 然后引入使用 npm 进行下载npm install xlsximport XLSX from 'xlsx'导出文件/** * * @param sheetData 数组表格数据原创 2021-07-27 11:04:04 · 420 阅读 · 0 评论 -
call和apply的那些事
二者用途更改 this 的指向。????:var name = 'april'var boyfriend = { name: 'bran',}function getName() { console.log(this.name)}getName() // april,返回的是全局环境下的name变量// 如果想要获取变量boyfriend的name,可以怎么获取呢getName.apply(boyfriend)getName.call(boyfriend)call原创 2021-07-08 11:19:38 · 101 阅读 · 0 评论 -
js中的变量提升和函数提升
js 执行词法分析阶段:包括分析形参、分析变量声明、分析函数声明三个部分。通过词法分析将我们写的 js 代码转成可以执行的代码。执行阶段变量提升只有声明被提升,初始化不会被提升声明会被提升到当前作用域的顶端???? 1:console.log(num)var numnum = 6预编译之后var numconsole.log(num) // undefinednum = 6???? 2:num = 6console.log(num)var num预编译之后原创 2021-07-06 16:09:50 · 175 阅读 · 0 评论 -
拖动鼠标更改 DIV 高度
背景如图所示,实现拖动更改高度。实现添加一条线,用来控制拖动,鼠标拖动时,计算拖动距离更改 div 的高度。主要是通过 mousedown、mousemove、mouseup 等鼠标事件来实现。<div id="drag-box"> <div class="data-list" id="drag-top"></div> <!-- 辅助线(用于调整文本框高度) --> <div id="resize" class="res原创 2021-07-05 10:40:17 · 1989 阅读 · 0 评论 -
金额格式化
背景在用 echarts 显示柱状图的时候,希望在柱状图的外面显示数据。通过设置 label 为 true,是显示了,但因为 echarts 内部做了处理,纵坐标和鼠标滑上去显示的都是千分位逗号隔开的形式,所以手动显示的 label 也希望保持同样的格式。实现export function toMoney(num) { num = parseFloat(num) num = num.toLocaleString() return num}方法介绍num = num.原创 2021-06-03 16:46:52 · 475 阅读 · 0 评论 -
在相等比较中使用 Object.is()
前言JavaScript 是弱类型的,在使用 == 作比较时,在一些情况下由于类型转换,会出现意想不到的结果。0 == ' ' //truenull == undefined //trueJavaScript 提供了全等操作符===,它比更加严格并且不会发生类型转换,但是用 **=** 来进行比较也不是最好的解决方案,也会出现问题。NaN === NaN // false敲重点Es6 中提供了新的 Object.is(x, y)方法,它具有 === 的一些特点,而且更好、更精确,一些特殊的原创 2021-05-12 09:56:22 · 89 阅读 · 0 评论 -
Javascript 获取数组中最大和最小值
排序法将数组进行排序,按照从小到大的顺序来排,排序之后的数组中的第一个元素就是我们想要的最小值,最后一个元素为最大值。let arr = [12, 33, 8, 54, 36]// sort方法会改变原数组arr.sort(function(a, b) { return a - b})// 最小值let min = arr[0]// 最大值let max = arr[arr.length - 1]假设法假设数组中的第一个元素是最大值,然后拿这个最大值和后面的项逐一比较,如果原创 2021-02-07 11:07:06 · 1252 阅读 · 0 评论 -
事件触发一次
vue 中实现大家都知道,vue 中在事件处理程序中提供了事件修饰符stoppreventonce<!-- 阻止单击事件继续传播 --><a v-on:click.stop="doThis"></a><!-- 提交事件不再重载页面 --><form v-on:submit.prevent="onSubmit"></form><!-- 点击事件将只会触发一次 --><a v-on:click.原创 2021-02-03 15:15:06 · 424 阅读 · 0 评论 -
跨域学习
跨域浏览器具有同源策略。所谓同源是指’协议、域名、端口’三者都相同,其中一个不相同,都是不同源。同源策略限制以下行为:(1)Cookie、LocalStorage 和 IndexDB 无法读取(2)DOM 和 JS 对象无法获得(3)Ajax 请求不能发送解决方法JSONP 跨域原理:利用 script 标签没有跨域限制,通过标签 src 属性,发送带有回调函数的 GET 请求,服务端将接口返回的数据拼凑到回调函数中,返回给浏览器,前端可以在回调函数中拿到返回的数据。<scrip原创 2021-01-28 18:44:58 · 102 阅读 · 2 评论 -
js获取图片和视频的宽高等
获取图片和视频的宽高日常开发中,在提交给后端视频和图片等文件之前,需要控制文件的的宽高,大小等。图片// 上传文件的方法uploadFile(e) { let that = this // 该file中可以获取到文件名,大小等信息 let file = e.target.files[0] let img = new Image() let reader = new Fi原创 2020-05-15 10:35:19 · 3064 阅读 · 0 评论 -
FormData学习
FormDataFormData 提供了表单数据的键值对,经过其的数据可以通过 XMLHttpRequest 向后端发送,编码类型需要被设为‘multipart/form-data’.构造函数FormData() 创建一个新的 FormData 对象方法FormData.append()向 FormData 中添加新的属性值,如果属性存在,也不会被覆盖,会新增,属性不存...原创 2020-01-07 15:06:51 · 730 阅读 · 0 评论 -
js实现链表
链表链表是一组节点组成的集合,每个节点都使用一个对象的引用指向他的后一个节点。它分为单向链表、双向链表、单向循环链表和双向循环链表。插入节点:在需要插入节点的位置的节点(前驱)指向新插入的节点,将新节点指向前驱本来指向的节点。删除节点:将待删节点的前驱指向待删节点指向的节点,将待删除节点的指向设置为 null链表设计:两个类,一个用来表示节点【Node】,另一个类提供删除、插入节点...原创 2019-12-19 12:40:09 · 375 阅读 · 0 评论 -
javaScript的问题
js 中的值传递和引用传递js 函数传参的时候,如果是基本类型,则按值传递,如果是引用类型,则是引用传递(按地址传递)var num = 1function foo(num) { num = num + 1 return num}foo(num) // 2num // 1function changeAgeImpure(person) { person.ag...原创 2019-12-19 12:35:44 · 180 阅读 · 0 评论 -
web安全
web安全那些事XSSSQL注入CSRFXSS【跨站脚本攻击】介绍:允许攻击者将恶意代码植入到提供给其他用户使用的页面中。不同于大多数攻击(只涉及攻击者和受害者),XSS涉及三方(攻击者、客户端、web应用)。XSS的攻击目标是为了盗取存储在客户端的cookie或者用于识别客户端身份的敏感信息。一旦获取到合法的信息后,攻击者甚至可以假冒合法用户与网站进行交互。分类:存储型XSS...原创 2019-11-04 11:58:21 · 130 阅读 · 0 评论 -
关于js继承
1.//构造函数实现继承,缺点:无法继承父类原型链上的属性和方法 // 父类 function Parent1() { this.name = 'name'; } Parent.prototype.say = function() { console.log('111') } ...原创 2018-10-14 17:16:08 · 110 阅读 · 0 评论 -
原型和原型链
创建对象的方法// 构造函数var F = function () { this.name = 2}let obj = new F()let obj = {name:1 }let obj = new Object({name:1})var P = {name: 3}let obj = Object.create(P)原型、构造函数实例对象通过对构造函数n...原创 2018-10-12 13:33:32 · 116 阅读 · 0 评论