- 博客(30)
- 收藏
- 关注
RSS订阅原创 Ajax案例笔记
原生ajax//1.创建对象优化var xhr = new XMLHttpRequest();//2.给对象添加属性和方法xhr.onreadystatechange = function(){console.log(xhr.readyState); //请求状态码 http 1-4 if(xhr.readyState == 4){ console.log(xhr.status); if(xhr.status == 200){ console.log(xhr.responseTex
2021-05-28 11:37:37
128
原创 ES6笔记 概念与新增语法 const命令 Ⅲ
1.定义① 声明一个只读的常量。②声明常量时一定要赋值，不然会报错，const foo;// SyntaxError: Missing initializer in const declaration// 丢失了它的初始值③ 声明的变量不得改变值 ， 一旦声明变量，就必须立即初始化，不能留到以后赋值。④只能同时声明和赋值 或先声明后使用⑤ 声明的常量，也与let一样不可重复声明。⑥既然是常量不能重新进行赋值，如果是基本数据类型，不能更改值，如果是复杂数据类型，不
2021-05-21 11:50:25
169
原创 ES6 经典面试题
ES6 经典面试题var声明变量var arr = []; //声明一个空数组for (var i = 0; i<2;i++）{ //循环arr[i] = function () { //函数console. log(i); }}arr[0](); //2arr[1](); //2经典面试题图解:此题的关键点在于变量i是全局的，函数执行时输出的都是全局作用域下的i值。let 声明变量let arr = [];for (let i =0; i&
2021-05-18 17:29:47
398
原创 ES6笔记 概念与新增语法 let命令 Ⅱ
一、ES6相关概念1.什么是ES6ES的全称是 ECMAScript，它是由ECMA国际标准化组织,制定的一项脚本语言的标准化规范。二、ES6新增的语法1.let命令，声明的变量只在所处于的块级有效{{ let a = 10; //let只能在{}内生效 var b = 1; //var全局变量，可以读出}a // 报错b // 1}注意:使用let关键字声明的变量才具有块级作用域，使用var声明的变量不具备块级作用域特性。1.1for循环案例1for (let
2021-05-18 17:06:56
209
原创 ES6 笔记 入门 Ⅰ
ES6 和 ES7-ES10的图片1.ES6的定义ECMAScript 6.0(以下简称ES6)JavaScript语言的下一代标准2.ES6的颁布是由ECMA(欧洲计算机制造商协会)3.如何将ES6转换ES5(面试有问)在node.js里面有Babel(转码器)的包// 转码前input.map(item => item + 1);// 转码后input.map(function (item) { return item + 1;});有部分可以参考https:/
2021-05-18 14:56:47
211
原创 ajax 笔记 异步加载，局部刷新 ajax处理网络请求 xhr对象的常用属性与方法
ajax优点异步加载，局部刷新①Ajax在浏览器与服务器之间异步加载数据，解决在网速慢的情况下，页面加载时间长，用户枯燥等待的问题②页面局部刷新，接收到数据后只更新相应的部分内容，例如导航地图的更新③可以充分利用客户端闲置的处理能力，减轻服务器和网路传输的负担④使web中界面与应用相分离 也可以说是数据与呈现相分离3、ajax处理网络请求Ajax模块在处理网络请求的时候包括以下四个步骤 1.通过XMLHttpRequest类创建xhr对象 2.为xhr对象添加属性与回调方
2021-05-13 10:31:12
468
原创 前端网络 笔记 异步和同步
异步和同步1、定义：同步：按照顺序一个一个的执行，同一时间只做一件事情,落实到代码中，就是上一行代码执行完成后，才能执行下一行代码，即代码逐行执行。 console.log(1); console.log(2); console.log(3); 执行结果：1，2，3异步：改变正常执行顺序的操作都是异步,一个人一件事情做了一半，转而去做其他事情，当其他事情做完以后， 再回过头来继续做之前未完成的事情。落实到代码上，就是异步代码虽然需要花费时间去执行，但程序不会等待异步代码执行完成
2021-05-13 09:35:42
457
原创 jQuery笔记 动效和节点操作 ③
(三)jQuery动效和节点操作一、插入为子节点1、父节点.append(子节点) 父节点内的末尾插入子节点2、子节点.appendTo(父节点) 子节点插入到父节点的末尾3、父节点.prepend(子节点) 父节点内的第一个位置插入子节点4、子节点.prependTo(父节点) 子节点插入到父节点的末第一个位置二、插入为兄弟节点1、兄节点.insertBefore(弟节点) 兄节点插入到弟节点的前面2、弟节点.before(兄节点)
2021-05-11 14:17:32
229
原创 JQuery笔记 尺寸、位置操作 ②
二、JQuery尺寸、位置操作(一)JQuery尺寸操作JQuery尺寸操作包括元素宽高的获取和设置，且不一样的API对应不一样的盒子模型语法用法width()/ height()取得匹配元素宽度和高度值 只算width /heightinnerWidth() / innerHeight取得匹配元素宽度和高度值,包含paddingouterWidth() / outerHeight取得匹配元素宽度和高度值,包含padding
2021-05-11 14:14:13
292
原创 JQuery笔记 遍历 ①
一、遍历(一)遍历后代元素JQuery方法描述$(“选择器父节点”).children()获取所有子节点$(“选择祖先节点”).find(“选择器”)获取所有指定的子孙节点$(".first").children().css(f"background":"red"));$(".first").children("li").css(f"background":"#0000ff"});$(".first").find("li").css({"background":
2021-05-11 14:11:47
217
原创 js笔记 DOM节点 Ⅷ
一、通过DOM树/层级关系找节点1、子节点.parentNode 找父节点2、父节点.firstElementChild 找第一个标签子节点3、父节点.lastElementChild 找最后一个标签子节点4、兄节点.nextElementSibling 找紧跟着兄节点的那个弟节点5、弟节点.previousElementSibling 找紧跟着弟节点的那个兄节点二、节点的创建、克隆 、添加到页面1、document.createElement(“标签”) 通
2021-05-07 11:46:58
223
原创 js笔记 BOM history，location，documen对象 Ⅶ
三.history对象历史浏览器history.back() 后退 等价于 history.go(-1)history.forward() 前进 等价于 history.go(1)四.location对象1.location.herf 获取当前页面的完整urllocation.herf =“其他页面完整的url” 做页面跳转2.location.reload() 刷新本页面3.location.replace(“完整URL”) 做页面的跳转五.document
2021-05-07 11:45:01
247
原创 js 笔记 BOM Ⅵ
一、定义及特点BOM：浏览器对象模型，核心对象是window对象window对象里包含 history对象 location对象 document对象二、window对象的属性和方法（一）常用事件2个键盘，3个界面，5个表单，10个鼠标事件名（英文）含义（中文）触发机制onload加载页面加载或图片加载onclick点击单击鼠标左键ondblclick双击双击鼠标左键onmousedown鼠标按下按下鼠标左键onmouseup鼠标
2021-05-07 11:27:35
202
原创 js笔记 String对象 Ⅴ
（四）String对象1.定义用引号引起来的文本是字符串，String对象用于处理字符串2.创建①构造函数var str = new String(‘abc’);②语法糖var str =‘得分23’var txt = new String("string");或者更简单方式：var txt = "string";3.属性①length 字符串长度.var str = 'a我b8 cd-3' ;console.log(str.length); //9②数字、字母、空格、汉
2021-05-07 11:15:06
243
原创 js笔记 Math对象和Data对象 Ⅳ
（二）Math对象1.定义用于处理数学任务2.属性Math.PI 圆周率3.方法①Math.abs(x) 取绝对值②Math.ceil(x) 上舍入 如果为负数的小数，那么取的值为比负值大 例如-2.99 值为-2③Math.floor(x) 下舍入 如果为负数的小数，那么取的值为比负值大 例如-2.99 值为-3④Math.round(x) 四舍五入⑤Math.random() 0-1的随机数⑥Math.min(x,y,n…) 取最小值⑦Math.max(x,y,
2021-05-07 10:05:19
247
原创 js笔记 数组Array Ⅲ
（一）数组Array1.定义：用单独的变量名存储一系列的值2.创建①构造函数方法let 数组名称 = new Array(size)；//size表示数组存放的元素总和注意：（）内写一个数字表示数组的个数，写多个内容是数组的元素，每个元素之间用逗号隔开②字面量的方法（语法糖）let 数组名称 = [ ] 字面量注意：[ ]内写一个数字表示数组的个数，写多个内容是数组的元素，每个元素之间用逗号隔开3.赋值①可以先声明后赋值，也可以同时声明和赋值②赋值的元素之间无间隙的是密集数
2021-05-07 10:01:52
336
原创 js笔记 运算符 Ⅱ
1.值类型/原始类型①underfunded 变量的初始值，表现此处缺少值②null 空，表示没有③number 数字，包含整数和浮点数 NaN特殊数字类型④boolean 布尔值，true真 false假⑤string 字符串，用引号引起来的内容都是字符串2.引用类型①object 对象②function 函数3.检测数据类型的方法typeof 变量①undef
2021-05-07 09:54:06
255
原创 jQuery基础语法
jQuery基础语法let js_Dove = document.getElementByName("id");let jq_Dove = $("#id");js:获取的是节点本身jq:获取的是jq对象/* 转换： jq对象[索引] <-------------js对象 ------------->jq对象 $(js对象)*/ // js： 标签节点本身var oDiv_js = document.getElementsByCla
2021-04-30 14:38:38
252
原创 canvas画布基础
canvas画布样式<canvas width="1000px" height="1000px"></canvas>js获取canvas画布的节点var can = document.getElementsByTagName("canvas")[0];var cxt = can.getContext("2d")console.log(cxt);在写canvas画布开始要有开始路径和结束路径cxt.beginPath(); //开始路径cxt.closePath
2021-04-26 14:04:31
345
2
原创 个性化时钟
使用canvas画布绘制一个好看的时钟<div> <canvas id="canvas" width="500" height="500" /></div> <script src="index.js"></script>var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); ctx.strokeStyle = '#
2021-04-25 14:28:38
261
原创 数组去重
简易的去重的方法函数法一：// 封装去重函数del function del(arr1) { var arr = []; arr1.map(function(v) { return arr.includes(v) || arr.push(v) }) console.log(arr) }var arr1 = [2,3,4,2,5,6,3,7,3,7,3,4 ,'y',0,'y',0,'a',NaN,NaN,fals
2021-04-19 16:00:53
213
原创 运动框架
① window.getComputedStyle(节点变量名).width/height返回带px单位的字符串var oDiv = document.getElementsByClassName("move")[0];console.log(oDiv);var wid = window.getComputedStyle(oDiv).width;//获取宽度console.log(wid);// "100px"var widNum = parseInt(wid);//取整--转换为数字让
2021-04-14 17:24:03
188
原创 js笔记 值类型 Ⅰ
1.值类型/原始类型①underfunded 变量的初始值，表现此处缺少值②null 空，表示没有③number 数字，包含整数和浮点数 NaN特殊数字类型④boolean 布尔值，true真 false假⑤string 字符串，用引号引起来的内容都是字符串2.引用类型①object 对象②function 函数3.检测数据类型的方法typeof 变量①undefine
2021-04-09 14:40:37
262
1
原创 二级联动
html所在地区： <select id="se1"> <option value ="">请选择省/市</option> </select> <select id="se2"> <option value ="">请选择城市/地区</option> </select>js<script type="text/javascript"> //1.获
2021-04-08 11:21:35
195
原创 js滚动事件
js滚动滑轮var slide = {index:1,scrollB:true,scroll:function(e){var e = e || window.event;if(!slide.scrollB) return;slide.scrollB = false; //设置滚动高度 屏的高度 var top = [0,-834,-1654,-2433,-3251,-3550]; var box = document.getElementById("slide");//找到滚动元素
2021-04-02 14:46:07
1223
原创 js的封装和基础的正则表达式的样式
js的封装和基础的正则表达式的样式//1.创建 //let reg =new RegExp("a","i");//构造函数 "i"无视大小写 //let reg2 = /a/i; //字面量的方法 常用 //console.log(reg.test("abc")); //true //需求一:密码是六位的数字, //let psw = prompt("请输入一个6位数字的密码"); //正则验证 //let re
2021-04-02 14:27:07
234
原创 删除，替换节点
/html代码块<ul> <li></li> <li></li> <li></li> </ul> <button type="button" onclick="del()">删除</button> <button type="button" onclick="change()">替换</button>js代码块/1. 父节点.
2021-04-01 14:35:20
423
1
原创 获取节点的内置方法
获取节点的内置方法html内容<img src="" id="pic" /> <div class="div1" id="one"> <p>1</p> <p name="sel">1</p> <p class="red">2</p> <p class="red">3</p> <p class="rde">4</p> &l
2021-03-31 16:25:46
226
原创 成绩的计算
自定义课目成绩个数 获取最高，最低，总分，平均分js内容//1)输出所有学生成绩 var arr = show(); each(arr); //2)求最高分和最低分 var maxScore = max(arr); console.log('最高分' + maxScore); var minScore = min(arr); console.log('最低分' + minScore); // 4)求总分 var sumScore = sum(arr); conso
2021-03-31 14:37:37
658
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人