js
文章平均质量分 50
请问大家代码怎么敲
这个作者很懒,什么都没留下…
展开
-
JavaScript数组方法汇总(史上最全)
一、在JavaScript中创建数组的方法(1)、Array构造函数创建数组在这里插入代码片原创 2021-11-02 16:12:29 · 487 阅读 · 1 评论 -
js原型原型链继承笔记
目录1.原型的初步认识2.没有原型的对象也是存在的3.原型方法与对象方法优先级4.函数拥有多个长辈5.原型关系详情与属性继承实例6.系统构造函数的原型提现1.原型的初步认识 let arr = ['A'] console.log(arr.concat("B"));-1.控制台显示_proto_就是他的父亲展开之后里面有concat: ƒ concat(),说明它调用的是父亲的方法,下面还有一层_proto就是他的父亲的父亲,里面也有很多方法。整体就有自己-父亲-父亲的父亲,也就是原原创 2021-07-12 23:33:21 · 163 阅读 · 1 评论 -
Promise一看就会!!!
什么是Promise,用promise解决什么问题Promsie是异步编程的一种解决方案:从语法上将,promise是一个对象,从它可以获取异步操作的消息;从本意上讲,它是承诺,承诺它过一段时间会给你一个结果。promise有三种状态:pending(等待状态),fulfiled(成功状态),rejected(失败状态);状态一旦改变,就不会再变。创造promise实例后,它会立即执行。我相信大家经常写这样的代码://当参数a大于10且参数fn2是一个方法时,执行fn2function fn1(a,转载 2021-06-11 23:07:21 · 58 阅读 · 0 评论 -
js高阶函数filter、map、reduce
我们从一个小案例彻底了解js高阶函数filter、map、reduce现有需求1.对一个数组进行过滤(小于100)2.对过滤的数组进行乘23.对数组所有数据求和1.我们不用高阶函数时会这样操作var arr = [10,20,30,50,40,120,150,500]// 1.过滤arr只要小于100的数据var newArr = [] //接收小于100的新数组for (let i = 0; i < arr.length; i++) { if(arr[i]<100){原创 2021-05-30 15:23:38 · 146 阅读 · 0 评论 -
07-ECharts显示相关(主题、调色盘、图表自适应)、动画相关(图表加载动画、增量动画、动画配置项)、交互API(全局echarts对象的方法、echartsInstance对象的方法)
目录内置主题自定义使用主题内容调色盘的使用颜色渐变样式的使用图表自适应的实现内置主题Echarts中默认内置了两套主题:light dark在初始化对象方法init中可以指明init有两个参数,第一个参数是dom节点,第二个参数是主题默认内置了两套主题 , light dark var mCharts = echarts.init(document.querySelector("div"), 'dark')lightdark除此之外我们也可以自定义主题自定义使用主题内容1.在原创 2021-05-15 15:52:26 · 319 阅读 · 0 评论 -
06-Echarts雷达图、仪表盘的基本实现
目录雷达图特点雷达图基本实现仪表盘的特点仪表盘的基本实现雷达图特点雷达图可以用来分析多个维度的数据与标准数据的对比情况雷达图基本实现<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-e原创 2021-05-15 11:50:03 · 226 阅读 · 0 评论 -
05-Echarts矢量地图实现、及常见效果
目录矢量地图实现流程矢量地图实现代码矢量地图实现流程ECharts最基本的代码结构准备中国地图的矢量数据使用Ajax获取矢量地图数据在Ajax的回调函数中注册地图矢量数据 echarts.registerMap(‘chinaMap’, 矢量地图数据)配置geo的type为’map’, map为’chinaMap’矢量地图实现代码<!DOCTYPE html><html lang="en"><head> <meta charset="U原创 2021-05-15 11:17:57 · 950 阅读 · 0 评论 -
04-Echarts饼图的基本实现、常见效果
目录饼图的特点饼图的基本实现显示文字格式化圆环效果南丁格尔图(根据百分比展现的图)选中效果饼图的特点饼图可以很好地帮助用户快速了解不同分类的数据的占比情况饼图的基本实现不需要配置xAxis和yAxis<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, in原创 2021-05-13 21:24:28 · 592 阅读 · 0 评论 -
03-ECharts直角坐标系的常用配置grid、axis、dataZoom
目录grid(直角坐标系内绘图网格)axis(坐标轴axis坐标轴分为x轴和y轴)dataZoom(区域缩放)grid(直角坐标系内绘图网格)直角坐标系内绘图网格,单个 grid 内最多可以放置上下两个 X 轴,左右两个 Y 轴。可以在网格上绘制折线图,柱状图,散点图(气泡图)。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="vie原创 2021-05-13 20:45:03 · 648 阅读 · 0 评论 -
02-Echarts散点图基本实现、气泡图、涟漪效果等
目录散点图特点散点图实现方法散点图基本实现气泡图涟漪动画效果散点图特点散点图可以帮助我们推断出变量间的相关性比如身高和体重的关系散点图也常用在地图的标注上散点图实现方法1.x轴数据和y轴数据:都是二维数组比如 [[‘身高’,体重],[‘身高’,体重],…]2.图标类型:在series下设置type:scatter xAxis和yAxis的type都要设置为value3.调整将坐标轴都设置为脱离0值比例,scale:true散点图基本实现<!DOCTYPE html><原创 2021-05-12 22:12:29 · 1885 阅读 · 0 评论 -
JS原型
1.函数的prototype属性每一个函数都有一个prototype属性,它默认指向一个object空对象(即:原型对象)console.log(Date.prototype);//{constructor: ƒ, toString: ƒ, toDateString: ƒ, toTimeString: ƒ, toISOString: ƒ, …}原型对象中有一个属性constructor,它指向函数对象console.log(Date.prototype.constructor === Date)原创 2021-04-24 22:23:28 · 53 阅读 · 0 评论 -
JSON
JSONJavaScript Object Notation JS对象表示法JSON和JS对象的格式一样,只不过JSON字符串中的属性名必须加双引号 JSON分类 1.对象{} 2.数组[] JSON中允许的值 1.字符串 2.数值 3.布尔值 4.null 5.对象(不包括函数对象)原创 2021-04-20 20:51:30 · 65 阅读 · 0 评论 -
JS简单轮播图,图片切换暂停开始
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script> window.onload =原创 2021-04-15 21:16:37 · 907 阅读 · 0 评论 -
JS中的BOM对象Navigation,Location,History
BOM对象(browser object model)*浏览器对象模型*BOM可以使我们通过JS来操作浏览器*在BOM中为我们提供了一组对象,用来完成对浏览器的操作1.window-代表的使整个浏览器的窗口,同时window也是网页中的全局对象2.Navigation-代表的当前浏览器的信息,通过该对象可以来识别不同的浏览器3.Location-代表当前浏览器的地址栏信息,通过Location可以获取地址栏信息,或者操作浏览器跳转页面4.History-代表浏览器的历史记录,可以通过该原创 2021-04-14 21:44:23 · 476 阅读 · 0 评论 -
js键盘移动div
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box {原创 2021-04-13 22:34:06 · 47 阅读 · 0 评论 -
js键盘事件
键盘事件 onkeydown 按键被按下 对于onkeydown来说一直按着不放的话,事件会一直触发 当onkeydown连续触发时,第一次和第二次中间间隔时间长,然后非常快 这种设置为了防止误操作的发生 onkeyup 按键被松开 键盘事件一般都会绑定给能够获取到焦点的对象或者是document<!DOCTYPE html><html lang.原创 2021-04-13 22:12:27 · 69 阅读 · 0 评论 -
js事件传播机制
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box1 {原创 2021-04-13 21:36:29 · 89 阅读 · 1 评论 -
js多事件绑定兼容所有浏览器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body> <button原创 2021-04-13 20:58:47 · 151 阅读 · 0 评论 -
什么是event
JS中的event 对象详解JS的event对象Event属性和方法:type:事件的类型,如onlick中的click;srcElement/target:事件源,就是发生事件的元素;button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下;(firefox中 0代表左键,1代表中间键,2代表右键)clientX/clientY:事件发生的时候,鼠标相对于浏览器窗口可视文档区域的左上角的位置;(在D转载 2021-04-13 12:51:27 · 1069 阅读 · 0 评论 -
事件冒泡,事件委托
事件冒泡,取消冒泡<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box1{原创 2021-04-13 12:41:47 · 87 阅读 · 0 评论 -
js div跟随鼠标移动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #box{原创 2021-04-12 22:35:55 · 74 阅读 · 0 评论 -
JS事件对象clientX clientY鼠标移动的水平和垂直位置
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #areaDIv{原创 2021-04-12 22:01:15 · 191 阅读 · 0 评论 -
JS样式相关的属性clientWidth,offsetLeft,scrollHeight,onscroll
clientWidthclientHeight这两个属性可以获取元素的可见宽度和高度这些属性都是不带px的,返回的都是数字,可以直接进行计算会获取元素宽度和高度,包括内容区和内边距<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sc原创 2021-04-12 21:35:46 · 75 阅读 · 0 评论