js - 随笔分类(第2页) - Tsunami黄嵩粟

利用正则搜索替换

摘要：<div id="box"> <div id="header"> <input name="search" type="text" placeholder="搜索内容" class="search"/> <button class="but1">搜索</button> <input type="te 阅读全文

posted @ 2020-12-08 23:23 Tsunami黄嵩粟阅读(128) 评论(0) 推荐(0)

正则特殊符号

摘要：// 正则表达式的特殊符号 /* \ 转义符元字符都是以 \ 开头的 \n转义符换行 \d元字符表示数字在JavaScript中,转义符和元字符的设定,永远不会冲突符合哪个的语法,就执行哪个 | 逻辑或正则表达式支持逻辑运算符多个条件,默认执行并且逻辑与的关系如果设定 | 是逻辑或阅读全文

posted @ 2020-12-08 23:21 Tsunami黄嵩粟阅读(427) 评论(0) 推荐(1)

正则边界符限定符

摘要：// 正则表达式的边界符 // ^ 开始写在正在表达式的始位置 // $ 结束写在正在表达式的结束置 // let str = '1a123456abcdefg1'; // 独立使用只要包含数字,返回值就是true // let reg1 = /\d/; // let bool1 = reg1. 阅读全文

posted @ 2020-12-08 23:15 Tsunami黄嵩粟阅读(163) 评论(0) 推荐(0)

正则表达式和元字符

摘要：// 字面量语法 let reg = /要定义的正则表达式/ ; // 两个 / / 类似于字符串的 ' ' 引号 // 定义正则表达式必须的符号 // 构造函数语法 let reg = new RegExp(); // 2,正则表达式的方法 // test() 判断字符串是否符合正则表达式规范阅读全文

posted @ 2020-12-08 23:09 Tsunami黄嵩粟阅读(105) 评论(0) 推荐(0)

随机背景图

摘要：<style> div{ width: 432px; height: 768px; background: url('./image/1.jpg') no-repeat; } </style> </head> <body> <button>随机背景</button><br> <button name 阅读全文

posted @ 2020-12-08 22:56 Tsunami黄嵩粟阅读(93) 评论(0) 推荐(0)

秒表

摘要：<div>00:00:00:000</div> <button >开始</button> <button>停止</button> <button>重置</button> <script> // 秒表定义时,需要注意的一个关键问题 // 设定世间间隔的最小数值 // 显示器的刷新率表示一秒钟显示阅读全文

posted @ 2020-12-08 00:13 Tsunami黄嵩粟阅读(227) 评论(0) 推荐(0)

数组相关的函数

摘要：<ul> <li name="a">1</li> <li name="a">2</li> <li name="a">3</li> <li name="a">4</li> <li name="a">5</li> </ul> <script> // 数组的相关函数 // .pu 阅读全文

posted @ 2020-12-08 00:02 Tsunami黄嵩粟阅读(88) 评论(0) 推荐(0)

对象的结构语法

摘要：// 对象的解构语法 // 把对象中,属性/键名/键存储的属性值/键值/值解构出来,赋值给变量存储 // const obj = { name:'张三',age:18,sex:'男' }; // 语法形式1 // 变量名称与键名必须相同 // 通过键名获取数组中的数据,存储在名称相同的变阅读全文

posted @ 2020-12-07 22:53 Tsunami黄嵩粟阅读(169) 评论(0) 推荐(0)

数组的结构语法

摘要：<script> // 数组的解构语法 // 将数组的数据单元,解构出来,一一赋值给对应的变量存储 // 给变量赋值的另一种语法形式 const arr1 = ['北京','上海','广州','重庆','天津']; let [str1,str2,str3,str4,str5] = arr1; con 阅读全文

posted @ 2020-12-07 22:47 Tsunami黄嵩粟阅读(119) 评论(0) 推荐(0)

展开合并运算符

摘要：// 展开合并运算符 // 展开合并运算符,实际上都是一样的运算符 // 只是不同情况下,执行不同功能 // 运算符 ... 三个点 // 如果定义在形参 () 中 // 合并运算符,以数组的形式,将所有实参,存储在定义的形参中 // 语法1 , (...形参)=>{} 以数组的形式,将所有的实参阅读全文

posted @ 2020-12-06 11:21 Tsunami黄嵩粟阅读(132) 评论(0) 推荐(0)

立即执行函数

摘要：// 立即执行函数 // 不在内存中存储函数 // 在定义函数的同时,马上执行函数 // 执行完函数之后,就会立即释放内存中存储的函数 // 也就是立即执行函数,会马上执行,但是只能执行一次 // 有些函数执行时,只需要执行一次,如果使用立即执行函数,可以执行完毕后就释放函数,节约存储空间 / 阅读全文

posted @ 2020-12-06 11:14 Tsunami黄嵩粟阅读(109) 评论(0) 推荐(0)

改变函数中的this指向

摘要：// 改变函数的this指向 // 先记住一句话 : 箭头函数不能改变this指向 // 语法1: call() 方法 // 在调用函数时使用 // 在调用的函数名称后,添加点 call // 调用函数的()中,应该赋值实参 // 第一个实参是,改变的this指向对象 // 之后的参数是原始函数本阅读全文

posted @ 2020-12-06 11:07 Tsunami黄嵩粟阅读(129) 评论(0) 推荐(0)

箭头函数中的this指向

摘要：// 箭头函数中的this指向 // 如果是箭头函数,this指向是,父级程序的,this的指向 // 如果父级程序是一个函数,函数也是有this的,那么箭头函数的this,就是父级函数的this // 如果父级程序不是函数,例如对象,数组等,没有this指向,箭头函数的this指向是window顶阅读全文

posted @ 2020-12-06 10:59 Tsunami黄嵩粟阅读(161) 评论(0) 推荐(0)

箭头函数函数中的this指向

摘要：// 箭头函数 // 在匿名函数中,使用 => 箭头来替换关键词 function // 箭头定义下 () 和 {} 之间 // 等于在使用新的关键词声明函数 // 箭头函数的主要作用是,改变函数中的 this 指向 // 为了配合构造函数语法 // 普通的匿名函数 var fun = f 阅读全文

posted @ 2020-12-06 10:10 Tsunami黄嵩粟阅读(132) 评论(0) 推荐(0)

ES6 ES6变量的声明

摘要：// ES6语法 // 是对js影响最大的一个版本更新 // 在 ES6 语法中退出了很多新的语法结构 // 就相当于 js 语言, 换了一个新的发动机 // 比如 java 等是顶级跑车帕加尼福特地狱猫 // 之前的 JavaScript 最多算是宝马Z4 // ES6 之后可以算是阅读全文

posted @ 2020-12-06 09:57 Tsunami黄嵩粟阅读(112) 评论(0) 推荐(0)

范围内的拖拽事件

摘要：<style> * { margin: 0; padding: 0; } body { height: 5000px; } .box { width: 800px; height: 800px; border: 10px solid #000; margin: 30px auto; position 阅读全文

posted @ 2020-12-04 01:08 Tsunami黄嵩粟阅读(89) 评论(0) 推荐(0)

div拖拽移动事件

摘要：<style> * { margin: 0; padding: 0; } body { height: 5000px; } div { width: 100px; height: 100px; background: pink; position: fixed; top: 0; left: 0; } 阅读全文

posted @ 2020-12-04 01:06 Tsunami黄嵩粟阅读(964) 评论(0) 推荐(0)

事件对象的属性 div点击移动事件

摘要：// 事件对象的相关属性 // e.target 触发事件的标签对象 // e.target支持所有标签对象的操作 // e.target.parentElement 直接父级标签对象 // e.target.parentNode 直接父级标签对象 // e.target.tagName 触发事件的阅读全文

posted @ 2020-12-04 00:42 Tsunami黄嵩粟阅读(259) 评论(0) 推荐(0)

tab切换之循环遍历

摘要：<style> *{ margin: 0; padding:0; } ul,ol,li{ list-style: none; } .cont{ width: 800px; height: 600px; border: 5px solid #000; margin: 30px auto; displa 阅读全文

posted @ 2020-12-03 23:46 Tsunami黄嵩粟阅读(557) 评论(0) 推荐(0)

事件委托

摘要： <div> <span id="span1">我是第一个</span> <span id="span2">我是第二个</span> </div> <script> // 事件的委托 // 事件委托,大部分是对于动态阅读全文

posted @ 2020-12-03 23:43 Tsunami黄嵩粟阅读(92) 评论(0) 推荐(0)

随笔分类 - js