JavaScript
。
九阈
进厂了
展开
-
addEventListener和classList
classList 属性返回元素的类名,作为 DOMTokenList 对象。该属性用于在元素中添加,移除及切换 CSS 类。classList 属性是只读的,但你可以使用 add() 和 remove() 方法修改它。转载 2023-04-03 20:34:23 · 474 阅读 · 1 评论 -
js中toString方法
每一个对象都有一个 toString()方法。默认的情况下,toString()方法被每一个对象继承。如果toString没有被定义的对象覆盖。toString返回 ‘[object type]’ 其中type是对象的类型,type的值可以是Object。原创 2023-03-23 22:14:22 · 469 阅读 · 0 评论 -
es6--对象和class
2.构造函数不写return。原创 2022-11-13 17:43:49 · 92 阅读 · 0 评论 -
解构赋值、对象简写、展开运算符
【代码】解构赋值、对象简写、展开运算符。原创 2022-11-12 22:38:30 · 175 阅读 · 0 评论 -
js中ECharts的显示相关、动画、交互API、Koa2
●检查Node的环境node -V●安装Koa●创建并编写app.js文件1.创建Koa对象2.编写响应函数(中间件)3.监听端口●启动服务器创建文件夹koatext然后打开终端npm init -y新建文件app.js。原创 2022-11-11 21:44:59 · 725 阅读 · 0 评论 -
js中ECharts基础
ECharts是一个使用JavaScript 实现的开源可视化库,可以流畅的运行在PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,t Firefox,Safari等) ,底层依赖矢量图形库ZRender,提供直观,交互丰富,可高度个性化定制的数据可视化图表。原创 2022-11-11 16:34:18 · 7542 阅读 · 1 评论 -
pageX、clientX等的区别
其中包含了许多的坐标,且每个坐标的含义都不一样。下面我们来挨个介绍常用的坐标,以及它们的含义。对于整个页面来说,包括了被卷去的body部分的长度。点击位置距离当前body可视区域的x,y坐标。点击位置距离当前电脑屏幕的x,y坐标。和screenX、screenY一样。相对于带有定位的父盒子的x,y坐标。转载 2022-11-03 16:50:21 · 400 阅读 · 0 评论 -
面向对象1
面向对象是我们的一种开发方式面向过程:一种关注过程的开发方式=>在开发过程中,我们要关注每一个细节,步骤,顺序面向对象:一种面向对象的开发方式=>在开发过程中,我们看看有没有一个对象能帮我们完成任务字面量创建对象内置构造函数创建对象工厂函数创建对象自定义构造函数创建对象即构造函数的使用构造函数的不合理原型...原创 2022-06-13 14:33:59 · 64 阅读 · 0 评论 -
BOM和DOM基础
。原创 2022-06-05 16:13:19 · 73 阅读 · 0 评论 -
测试Ajax和get与post以及案列登录
第一次测试Ajax<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <..原创 2022-05-25 16:37:09 · 248 阅读 · 0 评论 -
JavaScript—箭头函数
箭头函数 :新潮的函数写法 【注】适当的省略函数中的function和return关键字 <script> // function add(x){ // return x + 10; // } var add = x => x + 10; alert(add(5)); </script> <script> //...原创 2022-02-15 16:34:30 · 550 阅读 · 0 评论 -
JavaScript—this和let和const
this和强制改变this方向 call 格式:函数名.call(); 参数: 第一个参数:传入该函数this指向的对象,传入什么强制指向什么 第二个参数开始:将原函数的参数往后顺延一位。 <script> function show(x,y){ alert(this); alert(x+ "," +y); } sh原创 2022-02-15 15:27:38 · 315 阅读 · 0 评论 -
JavaScript—localStorage语法
localStorage 对象 setItem(name,value); getItem(name); removeItem(name); <script> if(!window.localStorage){ alert("当前页面不支持localStorage"); }else{ localStorage.setItem("a","1"); ...原创 2022-02-15 14:02:50 · 152 阅读 · 0 评论 -
JavaScript—正则实现表单验证和密码强度验证
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2022-02-14 17:22:56 · 242 阅读 · 0 评论 -
JavaScript—正则表达式
1、通过new去声明正则表达式 第一个参数:正则表达式的主体 字符串 第二个参数:修饰符 【注】修饰符没有顺序 2、省略new运算符去声明正则表达式 3、通过常量赋值 <script> //var box1 = new RegExp("hello","ig"); //var box1 = RegExp("hello","ig"); var ...原创 2022-02-14 14:15:44 · 241 阅读 · 0 评论 -
JavaScript—动态生成表格
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2022-02-13 13:59:02 · 82 阅读 · 0 评论 -
JavaScript—事件委托和Event事件监听器
事件委托实现步骤:1、找到当前节点的父节点或者祖先节点2、将事件添加到你找到的这个父节点或者祖先节点上3、找到触发对象,判断触发对象是否是想要的触发对象,进行后续的操作<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta原创 2022-02-13 13:00:44 · 505 阅读 · 0 评论 -
JavaScript—拖拽
拖拽:(拖拽的三剑客) mousedown 记录鼠标按下位置和被拖拽物体相对距离 var offsetX = e.clientX - node.offsetLeft; var offsetY = e.clientY - node.offsetTop; mousemove 一致距离,相对距离 node.style.left = e.clientX - offsetX + 'px';...原创 2022-02-12 15:34:38 · 152 阅读 · 0 评论 -
JavaScript—阻止默认行为和超链接
阻止默认行为实现自定义的右键菜单,鼠标按下按下的右键 往右键这个位置显示菜单如果按下是别的键,菜单消失<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=d原创 2022-02-12 14:00:59 · 337 阅读 · 0 评论 -
JavaScript—事件冒泡和目标对象以及事件练习
target 目标对象/触发对象 事件对象的属性 【注】这个事件是由谁而起的 IE8以下不兼容 window.event.srcElement; this永远指向当前函数的主人<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content=.原创 2022-02-12 13:19:33 · 100 阅读 · 0 评论 -
JavaScript—事件对象和事件对象属性
事件绑定 元素节点.on + 事件类型 = 匿名函数 【注】系统会在事件绑定一旦完成的时候,生成一个事件对象 【注】触发事件的时候,系统会自动去调用事件绑定的函数,将事件对象当做第一个参数传入。 条件对象: button 的属性 0左键 1滚轮 2右键 获取当前鼠标的位置:(原点位置不一样) clientX clientY 原点位置:可视窗口的..原创 2022-02-10 16:51:14 · 378 阅读 · 0 评论 -
JavaScript—认识事件和事件类型
绑定事件 1、内联模式 2、外联模式/脚本模式(最多) 绑定事件格式: 元素节点.on + 事件类型 = 匿名函数 click 事件类型 onclick 事件处理的函数内联模式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta htt...原创 2022-02-10 14:30:50 · 477 阅读 · 0 评论 -
JavaScript—数组和对象的遍历
数组: for循环 for...in快速遍历 forEach举个列子<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-w原创 2022-02-09 18:28:27 · 199 阅读 · 0 评论 -
JavaScript—offset系列以及文档碎片
首先<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>原创 2022-02-09 17:13:55 · 527 阅读 · 0 评论 -
JavaScript—选项卡
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2022-02-09 16:09:03 · 168 阅读 · 0 评论 -
JavaScript—this和找到当前点击按钮下标
this概念:只要封装函数,任何一个函数系统都会内置一个叫做this的变量。 this变量存储的是地址,是当前函数主人的地址 【注】this永远指向当前函数的主人,函数的主人要通过当前上下文去判断 this类似于现实生活中,用到的“我” <script> var person = { username: "眼前", sex:"男", show : function(...原创 2022-02-09 13:41:27 · 592 阅读 · 0 评论 -
JavaScript—节点操作案例(增加、删除、拷贝)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc原创 2022-02-08 22:29:12 · 160 阅读 · 0 评论 -
JavaScript—attribute和节点(属性、子节点、属性节点attributes以及节点操作)
attributesetAttributegetAttributeremoveAttribute()<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=dev原创 2022-02-08 19:33:27 · 1093 阅读 · 0 评论 -
JavaScript—改变字体颜色和大小
写一个定时器,每个一秒修改一次div内文本颜色和文字大小 最开始这个文字是默认大小,大小开始增大,当增大了6次以后, 文字大小开始缩小,缩小6次,文字在开始增大。首先改变字体颜色和大小.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="I...原创 2022-02-07 15:38:19 · 6009 阅读 · 0 评论 -
JavaScript—获取当前有效样式
获取当前有效样式首先通过.style.xxx的方式只能访问内联的CSS样式举个列子<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,原创 2022-02-07 14:49:12 · 210 阅读 · 0 评论 -
JavaScript-DOM(获取元素节点、自定义byClassName方法)
DOM: document object model(文档对象模型) 节点类型: 元素节点 <div></div> 属性节点 id = 'div1' 文本节点 div文本 元素节点的获取 document.getElementById(id) 功能:通过id获取符合条件的元素(id必须是唯一的) 返回值:就是符合条件的一个节点<!DOCTYPE htm原创 2022-02-07 13:30:48 · 1098 阅读 · 0 评论 -
JavaScript—BOM(confirm、prompt、open、history、location)
系统对话框window 方法(一般情况下window可以省略)alert()弹出对话框confirm()弹出一个带确定和取消的提示框举个列子(1) alert("hello");跟下面一样 window.alert("hello");(2) <script> var num = 10; alert(num); </script>跟下面一样 <script> var num原创 2022-02-06 13:59:52 · 512 阅读 · 0 评论 -
JavaScript--秒表
秒表.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <titl原创 2022-02-05 23:48:10 · 467 阅读 · 0 评论 -
javascript-对象(Math、日期(方法、定时器))
认识对象<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&原创 2022-02-05 22:31:03 · 528 阅读 · 1 评论 -
javascript中字符串验证码以及练习题目以及敏感词过滤以及表单验证
验证码:验证你是否是机器人纯数字组成的验证:非常容易破解 6位数字验证码数字和字符组成的验证码:0~9a~z 97~122A~Z 65~90随机:0~122方法:1、生成一个数组,装有的单个字符,长度62数字随机0~61的下标2、随机ASCII码值’//n位验证码 每一个数字的范围0~9 parseInt(Math.random()*10); <script> function numTestCode(n){ var arr原创 2022-02-05 14:26:01 · 627 阅读 · 0 评论 -
javascript中的字符串基础与方法
字符串概念:所有带单引号或者双引号的都叫做字符串字符串声明:1、通过new运算符去声明字符串2、省略new声明字符串3、字符串常量赋值原创 2021-10-23 22:49:15 · 73 阅读 · 0 评论 -
javascript中的数组介绍与方法以及选择冒泡排序
**声明数组**1、通过new创建数组参数:传入任意的数据,存储到数组中 var arr = new Array(100,true,"hello"); alert(arr);2、省略new运算符创建数组 var arr = Array(100,true,"hello"); alert(arr);3、数组常量进行赋值(JS一般使用中括号[]) var arr = [100,true,"hello"]; alert(arr);以上三个,结果都是原创 2021-09-21 12:56:03 · 161 阅读 · 0 评论 -
JavaScript中的递归
递归:1、函数自己调用自己2、一般情况有参数3、一般情况下有return注意:递归可以解决循环能做的所有的事情,有一些循环不容易解决的事情,递归也能轻松解决方法:1、首先去找临界值,即无需计算,获得的值2、找这一次和上一次的关系3、假设当前函数已经可以使用,调用自身计算上一次 <script> // 计算1~n的和 // sum(100)=sum(99)+100; // sum(n)=sum(n-1)+n;原创 2021-09-12 16:44:17 · 153 阅读 · 0 评论 -
JavaScript中的函数和arguments
有参数无返回值的函数形参:形式上的参数格式:function 函数名(形参1,形参2…){函数体;}调用函数:格式:函数名(实参1,实参2…);传参:用实参给形参赋值<script> function print(n){ for(var i=0;i<n;i++){ document.write("hello world<br/>"); } }原创 2021-09-05 13:27:53 · 78 阅读 · 0 评论 -
JavaScript中的关系运算符和循环练习
关系运算符和其他运算符一样,当关系运算符操作非数值时要遵循一下规则:(1)两个操作数都是数值,则数值比较(2)两个操作数都是字符串,则比较两个字符串对应的字符编码值:如果是两个单个字符进行比较,直接比较字符的ASIIC码值逐位,进行比较,如果比较出大小,就直接得出结果(3)两个操作数有一个是数值,则将另一个转换为数值,再进行数值比较 <script> alert("A"<"a");//true alert("abcd">"adc")原创 2021-09-04 18:37:45 · 206 阅读 · 0 评论