![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JS基础
官方认证新生代农民工_平安喜乐
这个作者很懒,什么都没留下…
展开
-
01、JS部分基础知识
1.事件和事件绑定1. 什么是事件? 事件是浏览器赋予元素的默认行为,也可以理解为事件是天生具备的,不论我们是否为其绑定方法,当某些行为触发的时候,相关的事件都会被触发执行! 「浏览器赋予元素的事件行为」 https://developer.mozilla.org/zh-CN/docs/Web/Events - 鼠标事件 + click 点击事件(PC:频繁点击N次,触发N次点击事件) 单击事件(移动端:300ms内没有发生第二次点击操作,算作单击事件行为,所以cli......原创 2022-07-03 11:09:57 · 198 阅读 · 0 评论 -
Set和Map数据结构
SetES6提供了新的数据结构Set。类似于数组,只不过其成员值都是唯一的,没有重复的值。Set本身是一个构造函数,用来生成Set数据结构var s = new Set();通过add方法向Set结构中加入成员[2, 3, 5, 4, 5, 2, 2].map(x => s.add(x))for (i of s) { console.log(i) }2 3 4 5 (表明set结构不会添加重复的值)Set结构接收一个数组作为参数,用来初始化。var items.原创 2022-05-14 23:47:52 · 62 阅读 · 0 评论 -
Math对象的常用方法
Math常用的方法原创 2022-05-14 23:28:42 · 598 阅读 · 0 评论 -
字符串的常用方法
初识字符串字符串可以是对象, var firstName = new String(“Bill”) ; typeof firstName => object new 关键字使代码复杂化字符串方法:所有的字符串方法都是返回新的字符串,不会更改原始字符3.length : 返回字符串长度4.indexOf() : 返回字符串中指定文本首次出现的索引(位置),未出现,返回-1 ,可接收两个参数,第一个参数是查找的内容,第二个参数,可传可不穿,从指定位置开始,eg:a.indexOf(‘name.原创 2022-05-14 23:08:48 · 87 阅读 · 0 评论 -
JS中对象的常用方法
JS对象的常用方法原创 2022-05-14 23:01:24 · 1184 阅读 · 0 评论 -
46+47.原生JS实现左右运动版轮播图
1HTML代码:<!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"> <ti.原创 2022-05-09 23:48:09 · 100 阅读 · 0 评论 -
45.swiper插件的基本应用
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"> <title>原创 2022-05-08 19:20:54 · 213 阅读 · 0 评论 -
41.实战案例之瀑布流效果(获取数据和数据绑定)
瀑布流概念:JSON格式数据:基于AJAX的四部操作:原创 2022-05-08 18:19:07 · 365 阅读 · 0 评论 -
39.图片延迟加载方案1
<!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>Document&.原创 2022-05-06 00:05:01 · 287 阅读 · 0 评论 -
38.Jquery基础知识及应用
/** JQuery(JQ): JS的一个类库 (方法库:包含了大量的,有助于项目开发的属性和方法)* 第一代版本 1.xx.xx: 1.11.3 兼容所有浏览器的 (包含IE6~8) 没有vue/react/angular等框架之前* ->(数据驱动),项目都是基于操作DOM完成的,基本上项目中都是使用JQ完成的* 第二代版本 2.xx.xx: 放弃了低版本浏览器的兼容处理, 迎合了一些移动端的开发处理 (同时诞生一个比JQ*...原创 2022-05-04 19:38:43 · 551 阅读 · 0 评论 -
37.JS盒子模型属性及应用
client系列+offset系列+scroll系列原创 2022-05-04 15:41:33 · 182 阅读 · 0 评论 -
24+25+26+27.常用获取DOM元素的几大方法+描述节点和节点之间关系的属性+元素对象常用的属性和样式操作+DOM操作之DOM的增删改
DOM简介:DOM(文档对象模型 document Object modal): 提供一系列的属性和方法,可以供我们操作页面中的元素 + 获取元素或者其他节点 + 修改/获取元素的样式和内容等 + 动态修改或者删除元素 + ..... Node节点:Node节点: 在页面中出现的任何内容都被称为节点 + 元素节点:元素标签 + nodeType:1 + nodeName:大写标签名 tagName...原创 2022-05-04 00:38:38 · 78 阅读 · 0 评论 -
21.数组中常用的20几个方法
原创 2022-05-03 20:20:30 · 176 阅读 · 0 评论 -
20. queryURLParams
/* queryURLParams: 获取一个URL地址问号传递的参数的值 问号传参: + 在页面跳转的时候,可以基于问号传参传递不同的信息,这样在跳转过去的页面中,就可以基于传递不同的内容(例如: 列表页面跳转到详情页面,详情页面展示不同的信息) + 在以后我们的vue/react组件开发中,我们也可以基于问号参数实现不同组件之间的信息传递 + 客户端想要从服务器获取不一样的数据,也可以把一些值基于问号参数的方式传递给服务器端 .原创 2022-05-02 23:18:17 · 145 阅读 · 0 评论 -
18+19.ES6中数组和对象的解构赋值+时间字符串格式化案例练习2
/* ES6中的"结构赋值": 主要针对于对象和数字,左侧定义和右侧值类似的结构,这样声明几个变量,快速获取到每一部分的信息*/数组结构赋值:let arr = [10, 20, 30, 40]// let [x, ...y] = arr// console.log(x, y); // 10 [20,30,40] "..."剩余运算符:把除了x以外,剩下数组中的每一项都拿到,存放到y中(y是一个新数组)// let [, , x, y] = arr// console....原创 2022-05-02 18:18:29 · 155 阅读 · 0 评论 -
17.时间字符串格式化案例练习1
// 需求: 真实项目中,我们从服务器获取到了时间字符串,但是格式并不是我们需要的,// 我们需要呈现在页面中的是 "yyyy年mm月dd日 hh时mm分ss秒"// 此时就需要客户端基于JS完成时间格式字符串的数据解析var time = "2020-9-18 9:55:12"思路一(subString):/* 思路1: 根据字符串截取的办法,获取到字符串中"年月日"等数据信息 + substr(n,m) 从索引n开始截取m个 + subs.原创 2022-05-02 17:06:32 · 181 阅读 · 0 评论 -
13+14+15+16.JS中三种常用的判断语句+小实战:开关灯特效+三种循环的详细解读+ break和continue
if else :三元运算符:处理最简单的 if esle情况的switch case:一个变量在不同值情况下的不同操作,我们可以改写为 switch case判断开关灯特效:三种循环详细解读:/* 循环: 多次重复进行某些事情的处理 + for循环 + for in循环 + while循环 + ...*/// for 循环:// 1.设定初始值// 2.设定/验证循...原创 2022-05-02 15:26:57 · 84 阅读 · 0 评论 -
11+12.数据类型检测和等号比较的数据转换+任意求和的实现
/* 数据类型检测 1. typeof [value] 2. [value] instanceof [constructor] 3. [value].constructod 4. Object.prototype.toString.call([value]) typeof [value] : 1. 返回结果都是一个"字符串",字符串中包含对应的数据类型 2. "number"/"string"/"boolean"/"undefined"/".原创 2022-05-02 13:56:42 · 68 阅读 · 0 评论 -
9+10.函数数据类型的详细解读1+2
/* 函数数据类型 函数:就是一个方法,可以实现某个功能*/var n = 10, m = 20var total = n + mvar average = (total / 2).toFixed(2)console.log(average);// 创建函数// + sum函数名(等同于变量,也是声明一个sum变量,只不过存储的值是一个函数)// + x或者y: 形参(变量),它是函数提供的一个入口(原因:封装这个功能,很多信息信息此时不清楚,执行时候用.原创 2022-05-01 23:54:36 · 77 阅读 · 0 评论 -
8.对象数据类型的详细解读
对象数据类型:+ 普通对象{} [类数组、实例、原型对象...] +数组对象 [ ] +正则对象 /^$/ +日期对象 +Set/Map +....普通对象: 1.对象是由零到多组键值对 (属性名和属性值) 组成的 {key:value,...} + 属性名(键) 不是变量,它是对象的一个属性(特征) + 属性名一般都是一个字符串(当然也可以是数字或者Symbol等基本类型的值) + 属性...原创 2022-05-01 21:20:31 · 539 阅读 · 0 评论 -
6+7: String字符串类型详细解读,boolean
String:boolean:原创 2022-04-23 21:04:14 · 214 阅读 · 0 评论 -
JS面向对象
new构造函数执行的机制:prototype和__proto__:大部分“函数数据类型”的值都具备“prototype(原型/显式原型)”属性,属性值本身是一个对象「浏览器会默认为其开辟一个堆内存,用来存储实例可调用的公共的属性和方法」,在浏览器默认开辟的这个堆内存中「原型对象」有一个默认的属性“constructor(构造函数/构造器)”,属性值是当前函数/类本身!! 函数数据类型 普通函数(实名或者匿名函数) 箭头函数 构造函数...原创 2022-04-23 15:27:10 · 57 阅读 · 0 评论 -
JavaScript基础
JS的数据类型分:(1)基本数据类型/原始值类型/值类型number、string、boolean、null、undefined、symbol、bigint(2)引用类型object 和function;object分:{}、[]、/^$/正则 ....JSON / Set / Map ... 是新的数据结构,不是数据类型number 数字类型+ 正数 / 负数 / 零 /小数+ Infinity 带别无穷大的值 +NaN...原创 2022-04-23 15:27:36 · 55 阅读 · 0 评论