- 博客(29)
- 收藏
- 关注
RSS订阅
原创 ES6整理笔记
一、ES6简介1、ECMAScript与JavaScript的关系ECMAScript是JavaScript的规则，JavaScript是ECMAScript的一种实现。2、ES6好处以及优势let、const变量的声明（默认参数）变量的解构赋值字符串模板（多行字符串）箭头函数Promise对象Class类的概念Module模块化3、ES6与ES5的关系ES6是ES5的语法糖4、 ES6与ES7的关系与ES6相比，ES7增加了关键词async的功能，并且可以使用await轻松
2020-07-20 20:07:24
220
1
原创 安卓 video 点击播放自动全屏
this.$nextTick(() => { this.autoFullScrenn(this.$refs.videoRef)})autoFullScrenn(v) { // const ua = navigator.userAgent.toLowerCase() // const Android = String(ua.match(/android/i)) == "andro
2022-01-27 16:36:05
372
原创 判断第一列 的字段相同的合并
<el-table class="lui-table" :data="tableData" :span-method="objectSpanMethod" :key="activeIndex" height="calc(100% - 92px)" stripe>```html```javascriptflitterData(arr){ let spanOneArr = [] let concatOne = 0 ar...
2021-07-12 10:13:25
149
原创 vue canvas 拖拽 放大缩小
<template> <div ref="tagcanvasbox" class="tagcanvasbox"> <canvas ref="tagcanvas" width='844' height='475' @mousedown ="mouseDown($event)" @mouseup ="mouseUp($event)" @mousemove ="mouseMov
2021-01-06 16:22:47
1024
2
原创 三级联动-day02
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document&l
2020-09-06 20:18:28
194
原创 Vue
什么是VueVue (读音 /vjuː/，类似于 view)是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。Vue.js 的基本使用 <div id="app"> <!-- 可以任意使用vue的语法 {{js表达式}} --> {{ 1+2 }} </div> <h1>{{ 1
2020-09-06 19:46:31
128
原创 数组的Api和遍历方法
//数组我们从以下几个维度去学习 //作用 //参数 //是否改变原数组 //返回值 //增加修改和删除 --改变原数组 // 1.push(); // 作用:在数组末尾增加数据，可以是一个也可以是多个 // 参数:数据，多个用逗号隔开 // 是否改变原数组：改变 // 返回值：返回增加后数组的长度 var arr1 = .
2020-08-04 18:46:51
201
原创 tab栏高亮切换Vue
<!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> #app>span{ margin-rig
2020-08-03 18:54:48
337
原创 实现表格的增删改Vue
<!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> #app>table th { widt
2020-08-03 18:54:13
155
原创 点击实现跑马灯效果Vue
<!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> #app>p { font-size:
2020-08-03 18:49:47
149
原创 Ajax
Ajax1.前后端交互的模型2.Ajaxasync javascript and xml :异步的 javaScript 和 xmlxml:可扩展标记语言 （根据自己定义的规则进行数据存储）ajax是js中提供的用来向服务发送请求（向服务器传递内容）的方法 客户端与服务进行交互的媒介3.ajax的使用 （ajax的四步）创建ajax实例 var xhr = new XMLHttpRequest;配置请求参数//基本语法格式 xhr.open(method,url,as
2020-07-20 20:29:11
96
原创 面向对象
面向对象在ECMAScript中有两种编程模式 一种是面向过程（函数式编程）和 面向对象（OOP）的编程思想面向过程：关心的是每一步实现的细节，第一步做什么，第二做什么，存在先后顺序面向对象： 关心的是一个整体及各个模块的协调面向对象概念：类 Array实例 [] new Array(1,2,3);世界万物皆对象，自然界中可以分为人类，动物类，植物类…，人类是由每一个人组成，每一个人就式实例JS中一切皆对象，比如数组类 创建的每一个数组都属于数组类的实例对象特定：都是有
2020-07-20 20:24:06
131
原创 事件
事件JavaScript的概念：js是具有一定面向对象能力的基于事件驱动的，并且是具备一定安全性客户端脚本语言（弱类型语言）；1.事件对象默认浏览器会把事件触发的对应信息当做实参（第一个参数）进行传递给事件处理函数（IE6~8不兼容的）当前事件触发，浏览器会把当前事件触发对应的信息（事件类型，事件源，位置…）保存到window的event属性中document.body.onclick = function (ev) {//ev：默认浏览器会把事件触发的对应信息当做实参（第一个参数）进行
2020-07-20 20:22:52
95
原创 BOM（Browser Obect Model）浏览器对象模型
BOM（Browser Obect Model）浏览器对象模型1.window系统提示框 (window的属性和方法window时可以省略)alert(内容); 弹窗confirm(内容); 带有确定和取消的提示框 确定返回：true 取消返回：falseprompt(内容); 带有输入框的提示框 输入内容返回对应字符串 没有就是 nullopen(地址,打开位置,‘外观设置’,布尔值); 打开一个新的窗口close(); 关闭当前窗口
2020-07-20 20:22:09
116
原创 DOM操作
DOM操作DOM（Document Object Model）：文档对象模型，DOM是W3C组织推介用来处理可扩展标记语言的接口（提供了处理HTML结构的方法）浏览器再去加HTML结构的时候，会把HTML结构以树形结构进行表现，这种树形结构就称之为DOM树，DOM树本身所有的内容都可以称之为节点。操作DOM也可以称之为操作DOM节点。1.获取直接子节点获取直接子节点childNodes 但是获取到不仅仅是元素对象，包含文本，注释等内容（IE6-8换行及纯空格作为文本节点不识别的）获取直
2020-07-20 20:21:33
142
原创 数组对象
数组对象1.数组对象的创建字面量 []构造函数的方式new Array(数值); 规定当前数组的长度new Array(数据1，数据2…);nw Array(); 空数组原来没有就是增加 有的话就是修改2.数组对象的方法增-增加修改和删除push(); 作用:在数组末尾增加数据，可以是一个也可以是多个 参数:数据，多个用逗号隔开 是否改变原数组：改变 返回值：返回增加后数组的长度pop(); 作用:在数组末尾删
2020-07-20 20:21:01
119
原创 时间对象与字符串对象
时间对象与字符串对象js中全部都是对象（万物接皆对象）一.时间对象1.创建 (Date)//只能通过构造函数的方式var date = new Date(); (日期对象/时间对象)2.日期对象的方法var date = new Date();//年 getFullYear() 具体的年份var year = date.getFullYear();console.log(year);//月 getMonth() 0-11 对应月+1var month = d
2020-07-20 20:20:24
122
原创 定时器与函数封装（笔记6）
定时器与函数封装1.定时器(window的方法)定义延迟定时器（一次性定时器）：只执行一次基本语法window.setTimeout(函数，时间);单位：毫秒间歇性定时器（轮循定时器）：每隔多长时间执行一次基本语法window.setInterval(函数，时间);单位：毫秒2.清除定时器清除一次性定时器基本语法window.clearTimeout(intervalID);清除间歇性定时器基本语法window.clearInte
2020-07-20 20:19:47
105
原创 函数高级（笔记5）
函数高级1.函数的返回值return将函数内部想要返回的内容进行返回退出当前函数（一旦遇到return整个函数就退出了）return后边的代码就不再执行了function sum(){ return 要返回的内容； //可以返回任意数据类型的}2.获取元素的非行内样式getComputedStyle(元素对象).属性返回值：样式值不兼容IE8及以下IE下独有的方法元素对象.currentStyle.样式属性只能获取不能设置，如果要
2020-07-20 20:17:45
65
原创 this详解及函数初识（笔记4
this详解及函数初识1.this概念：表示当前行为执行的主体在事件处理函数中this是当前触发的那个元素2.自定义属性元素对象.属性 = 值；3.自定义索引自定义索引的本质就是自定义属性，只不过我们我们赋值的是下标或索引4.函数1.函数的基础概念：具有特定的功能代码段函数理解为一台洗衣机实名函数基本语法//函数的定义function 函数名(){ 具体功能的代码段}//函数的调用函数名();//函数可以调用用无数次 前提函数存
2020-07-12 22:49:10
121
原创 流程控制（笔记3
isNaN(数据);判断当前数据是不是一个数字，是数字返回false,不是数字返回true(会自动转化，复合Number规律)流程控制语句在编程语言中（java,oc,c）都存在流程控制；简单的理解控制代码执行的逻辑；顺序结构：默认代码按照从上到下执行顺序去依次执行选择结构：if / switch循环结构：for/while/do-while/for-in其它：break/continue一.选择结构1.if单条件//基本语法//省略else->else是可以.
2020-07-12 22:46:24
99
原创 JavaScript数据类型（笔记）
JavaScript数据类型javaScript属于弱语言类型（松散型），当前数据类型是由值决定的 ;1.数据类型的分类基本数据类型Number :数字String：字符串Boolean：布尔null：空、空指针（没有指向的地址）undefined：未初始化（未赋值）复杂数据类型（引用数据类型）object 对象Object 对象类Array 数组类…function 函数2.数据类型的检测typeof 最基本的数据类型检测，一般用于检测
2020-07-12 22:45:15
86
原创 JavaScript初识（笔记）
JavaScript初识2.JavaScript的历史诞生的时间：1995年布兰登·艾奇 借鉴了C语言的基本语法 Java的数据结构 用了7天时间这门语言诞生了最初名字叫LiveScript 当时Java比较火 蹭下热度 后来改名为JavaScript (网景公司)js诞生之初是为了解决网页的表单验证（没有js的时候都是服务器做表单验证）3.js的引入行内基本不常用 <div style="width: 100px; height: 100px;ba
2020-07-12 22:44:23
174
原创 往返运动
<!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> * { p
2020-07-12 22:41:40
264
原创 滚轮事件
<!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 {
2020-07-12 22:40:47
146
原创 事件委托
<!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> * { p
2020-07-12 22:40:17
82
原创 轮播图
<!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> html, body, div,
2020-07-12 22:37:26
89
原创 在屏幕中心显示
```javascript<!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> * .
2020-07-12 22:34:58
425
原创 放大镜
<!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> * { p
2020-07-12 22:33:54
111
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人