js
关注
分享
扫一扫
礼礼。
这个作者很懒，什么都没留下…
展开
-
排序、计时器
数组元素由大到小依次排列设置一个每隔2s输出一个数字的功能，从1开始 1、2、3、4、5、、、、、、、、（每个2s自动输出，就像计时器一样）原创 2022-05-30 16:36:18 · 238 阅读 · 0 评论 -
map使用
map以数组形式打印出来以叠代的方式返回数据将value是小白的数据拿出来 变成一个新的集合原创 2022-05-30 15:24:54 · 133 阅读 · 0 评论 -
时间戳、返回毫秒数并转换成对应时间、添加删除插入替换调位数组元素、价格的排序、过滤、查找最高值、计算商品总价
时间戳（字符串类型和时间类型）返回总毫秒数（四种方式）将后毫秒数转换成相对应的时间；原创 2022-05-30 14:11:07 · 230 阅读 · 1 评论 -
axios请求方式的基本使用和并发请求
axios的基本使用：axios({ url:'http://123.207.32.32:8000/home/multidata',}).then(res => { console.log(res);})axios({ url:'http://123.207.32.32:8000/home/data', //专门针对GET请求的参数拼接 //（事实上就是将http://123.207.32.32:8000/home/data?type=pop&page=1拆分成了这种形式.原创 2022-04-27 17:20:40 · 1519 阅读 · 0 评论 -
【点击分类 进入商品页面 继续点击 进入商品详情页面】
实现思路：主页面（商品分类）：点击类别按钮，跳转商品页面商品页面（商品列表）：点击某个商品，跳转商品详情页商品详情页（调用接口）：调用接口，渲染商品详细信息主页面：先创建好这四个分类的页面（Inseason 、 Place 、Effect 、NutritionClass ）//Inseason ： 当季 <div class="item item1" @click="centerRouter('Inseason')"> <img src=""/>原创 2022-04-27 11:48:20 · 5003 阅读 · 0 评论 -
添加/删除/筛选/排序数组元素
添加/删除/筛选/排序数组元素在数组末尾继续添加元素 pushvar arr = [1,2,3];arr.push(4,5,'kkk');console.log(arr);在数组开头添加元素 unshiftvar arr = [1,2,3];arr.unshift('red');console.log(arr);删除数组的最后一个元素 pop()arr.pop(); //不需要再（）里写任何元素删除数组的第一个元素 shift()arr.shift();原创 2022-04-22 15:54:43 · 127 阅读 · 0 评论 -
倒计时案例
案例分析核心算法：输入时间 - 当前时间 = 剩余的时间时间戳计算：输入时间的总毫秒数 - 当前时间的总毫秒数 = 剩余的总毫秒数把剩余的总毫秒数转换成天、时、分、秒 来显示剩余时间毫秒数转时分秒的转换公式：d = parselnt(总秒数/60/60/24); //计算天数h = parselnt(总秒数/60/60%24); //计算小时m = parselnt(总秒数/60%60); //计算分数s = parselnt(总秒数%60); //计算当前秒数封装此方法：(原创 2022-04-22 14:52:57 · 238 阅读 · 0 评论 -
时间日期格式化
当前时间格式化（08:12:03）// 输出当前时间（带0） // 08:12:03 var date = new Date(), function getTime(){ var time = new Date(); var h = time.getHours(); h = h < 10 ? '0' + h : h; var m = time.getMinutes(); m = m < 10 ? '0' + m : m; var s原创 2022-04-22 14:19:39 · 896 阅读 · 0 评论 -
最常用的前端
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta NAME="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"> <title>Title</title> <script src="https://cd.原创 2022-04-22 11:06:01 · 133 阅读 · 0 评论 -
箭头函数、递归算法、this、闭包、防抖
使用箭头函数按条件输出let e = [1,2,3,4,5,6,7,8,9].filter((value,index) => value <= 3);console.log(e)//打印出的结果：[1,2,3]let sum = [1,2,3,4,5,6].reduce((a,b) => a+b);console.log(sum)//打印出的结果：21递归算法function factorial(num){ return num = 1 ? 1:num * factor原创 2022-04-19 18:20:12 · 1305 阅读 · 0 评论 -
ajax 模糊电话号码 封装日期格式化
Ajax工作流程哪些操作会发起网络请求？异步和同步的区别原创 2022-04-19 11:35:56 · 152 阅读 · 0 评论 -
遍历数组、对象 父子通信props/$emit
反转文字遍历数组在这里插入图片描述遍历对象原创 2022-04-15 15:52:36 · 129 阅读 · 0 评论 -
【无标题】点击分类 跳转页面 展示详细信息
通过调用接口渲染分类页面，绑定数据点击各个商品类型后通过id跳转详细商铺列表信息在商铺列表页面3.点击title后商铺信息页面也随之前换通过id将title和下方内容绑定 当title切换时 下方商铺列表也随之改变需调用商铺列表接口调用商铺的假数据接口需要处理，真实数据接口即可渲染数据的时候 进行了页面渲染的显示方式：每次页面一开始只显示五条数据，一次上拉加载 加载后出席那的数据要求不被覆盖，均呈现在页面上4.点击各个商铺后进入其详情页面商法列表想代码有点儿问题 在这儿修.原创 2022-04-14 17:44:44 · 323 阅读 · 0 评论 -
JSON.
JSON.parse()方法用来解析JSON字符串，构造由字符串描述的JavaScript值或对象。不允许逗号作为结尾，使用分号JSON.parse('{}'); // {}JSON.parse('true'); // trueJSON.parse('"foo"'); // "foo"JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]JSON.parse('null'); .原创 2022-04-11 15:51:37 · 648 阅读 · 0 评论 -
列表渲染的三种方式
根据元素 和元素的索引名 就可进行列表渲染for="{{list}}"：list为源数据数组，默认的数组元素名为$itemfor="{{value in list}}"：value为自定义的数组元素名，默认的数组元素索引名为$idxfor="{{(index, value) in list}}"：index为自定义的数组元素索引名，value为自定义的数组元素名<import name="tabbarpage" src="../Tabbar/index.ux"></import.原创 2022-04-08 09:52:01 · 936 阅读 · 0 评论 -
【无标题】记事本内容编写区
HTML<div> <div> //标题 <div> <input type="text" placeholder="标题..." value="{{title}}" //在data处定义title变量 maxlength="20" //最多输入20 个字 onchange="getTitle" /> </div>.原创 2022-04-07 11:53:01 · 128 阅读 · 0 评论 -
快应用模糊搜索
步骤：先判断数据是否为空，为空时表明当前数据为空 <div if="{{memoList.length === 0}}"> </div>否则不为空，建立搜索部分和列表部分（在同一个div中）html<div else> 搜索部分 <div><input onchange="goSearch()" placeholder="搜索备忘"/></div> 列表部分 <div for="searchL..原创 2022-04-06 18:13:22 · 506 阅读 · 0 评论 -
搞懂Promise async await 之间的联系
在js中右两种实现异步操作的方式：一、回调函数比如使用setTimeout()让一个传入的回调函数在指定时间后才执行setTimeout(() => { console.log("哈喽");},3000);这种方法虽然简单易懂，但是当需要一次执行多个异步操作时，程序就会一层一层的嵌套执行（所谓的回调地狱），所以就出现了promise函数二、Promise链式调用优点：它可以用一种链式结构将多个异步操作串联起来，避免了链式的层层嵌套fetch: 是JS中使用Promise的API，原创 2022-04-06 14:02:42 · 602 阅读 · 0 评论 -
转义符\ 数据格式的拼接
转义符let vv = "vvlikeVV"console.log(vv)document.write(vv)如果想让输出的样子为：vv“like”VV，就可以使用转义符\即可let vv = "vv\"like\"VV"如果想让输出的样子为：vv like VV，中间有间隙，就可以使用转义符\t即可html里的空格可以用 let vv = "vv\tlike\t\tVV"\n表示换行数据连接小明出生于2020年。let year = "2020年";原创 2022-04-02 16:50:51 · 321 阅读 · 0 评论 -
【点击某一行后背景颜色发生改变】
html<ul> <li></li> <li></li> <li></li></ul>jslet list = document.querySelectorAll('li');for (const li of list) { //使用for of方法 //console.log(li) 就能看到打印出三行列表 li.addEventListener('click', function().原创 2022-04-02 15:48:51 · 508 阅读 · 0 评论 -
【三角形 杨辉三角 打印奇偶数循环 js for break 循环】
1.打印三角形for ( let i=0; i<10; i++) { for ( let n=0; n<i; n++ ){ document.write("*"); } document.write("<br/>");}2.杨辉三角// 4 3 2 1 for ( let i=0; i<5; i++) { for ( let n=5-i; n>0; n-- ){ document.write("^"); }// 1 3 5 7 f原创 2022-04-02 15:18:28 · 440 阅读 · 1 评论 -
通过js创建单元格（while循环）
<script>function table(options = { tr: 5, td: 3 }) {document.write(`<table border="1" width="100%>`)}</script>原创 2022-04-02 14:20:18 · 637 阅读 · 0 评论 -
switch和if的简单基本使用
用switch方法判断该年龄属于哪类人群一般相对较为复杂的条件判断时就可以使用IF语句进行判断default: 当所有参数都不匹配的时候 就打印default执行的内容1.switch方法<script> function message(age) { let msg = " ", switch (true) { //此处switch(2>1)也可正常执行，因为2>1为真 case age > 60 : msg = "老年"; br原创 2022-04-02 11:38:33 · 391 阅读 · 0 评论 -
Apex上拉菜单（编辑、置顶、删除、取消）
引入Apex的上拉菜单组件/*图标*/<import name="my-icon" src="apex-ui/components/icon/index"></import>/*上拉菜单*/ <import name="my-action-sheet" src="apex-ui/components/action-sheet/index"></import>html<div class="btn"><!-- 多功能按钮 -.原创 2022-04-01 18:13:08 · 757 阅读 · 0 评论 -
调用接口，获取时间
<html> <!-- 日期调用 --> <div class="center"> <div class="center-one"> //2022年3月 <div class="left"> <text type="date" value="{{params.gregoriandate}}"></text>原创 2022-03-16 15:14:18 · 863 阅读 · 0 评论 -
【制作侧部导航栏，并添加消息提示】
整体：提示：这里简述项目相关背景：<template> <el-aside width="auto" :class="isCollapse?'menu-collapsed':'menu-expanded'"> 顶部头像/图片 导航栏 </el-aside></template>顶部图片/头像：提示：放置两个大小不同的图片，展开侧部导航栏时切换成大图片展示，否则显示小的，绑定changeCollapse点击事件<div.原创 2021-11-30 08:47:05 · 2778 阅读 · 0 评论 -
【表单验证】
表单验证视频教程原创 2021-11-19 18:36:54 · 537 阅读 · 1 评论 -
【Tab表单 删除/编辑】
删除：添加一个确认气泡框（elementUI复制修改），再次确认是否删除发现一个小问题，还没确认删除呢就已经删除了，此时需要取消删除按钮的点击事件，给“好的”按钮添加触发点击方法@onConfirm="点击事件"就解决了编辑：查看视频教程...原创 2021-11-19 18:32:25 · 282 阅读 · 0 评论 -
MVC和MVVM的区别
MVC和MVVM的区别1.MVC是后端语言M: Model.js数据操作模块C: router.js路由模块 controller.js业务逻辑模块V: View 视图层View层： 被MVVM层划分成三部分 M（页面中要渲染的数据） V （页面中用来展示的DOM元素） VM（MVVM思想的核心；他是调度者，用来练习M和 V层）2.MVVM是一个纯前端的概念两者相比 MVVM提供了数据的双向绑定机制...原创 2021-04-18 22:55:15 · 98 阅读 · 0 评论 -
计数器
学习笔记———————— <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script src="vue.js" type="text/javascript"></script> </head><body> <!--第一部分--> <div id=原创 2021-04-18 21:41:12 · 71 阅读 · 0 评论 -
v-on点击事件的基本使用
v-on作用：绑定事件监听缩写：@参数：event1.v-on的基本使用其中：click 点击事件counter:计数器methods 方法increment 增加decrement 减少v-on的缩写：@ 用@代替 v-on:2.v-on参数原创 2021-05-15 00:59:37 · 366 阅读 · 1 评论 -
数字运算符
学习笔记——哔哩哔哩——硅谷数字运算符（操作符）//运算符：也称操作符，通过运算符 可对一个或多个值进行运算///算术运算符：+ - * / % 不会对原变量产生影响，除非赋值<head>...<script>/*第一种情况var a = 123;var result = typeof a;console.log(resule);//返回值是 numberconsole.log(typeof resule);//返回值将会以字符串string的类型原创 2021-04-06 20:35:39 · 719 阅读 · 0 评论 -
全局/函数作用域
—————学习笔记—————1.全局作用域直接编写在script标签中的JS代码，都在全局作用域中在页面打开时创建，在页面关闭时销毁有一个全局对象window,代表的是一个浏览器的窗口，由浏览器创建，我们可以直接使用使用var关键字声明的变量时，会在所有的代码执行之前被声明，但是不会提前声明，直至那行代码的位置使用函数声明创建的函数 会在所有代码执行之前被创建2.函数作用域调用函数时创建函数作用域，函数执行完毕后，函数作用域销毁没调用一次函数，就会创建一个新的函数，之间互相独立在函数作原创 2021-04-03 21:45:53 · 131 阅读 · 0 评论 -
立即执行函数（用完立即被调用、并只会执行一次）
————学习笔记————立即执行函数函数对象()函数调用完会被立即调用，并且只会执行一次的函数(function(a,b){ console.log("a = " + a); console.log("b = " + b);})(123,456);//输出：a = 123 b = 456原创 2021-04-03 20:55:06 · 448 阅读 · 0 评论 -
break和continue的区别、Object对象、函数function
break和continue的区别一、break关键字可用来退出switch或循环语句1.不能在if 语句中使用break和continue2.如果想直接终止一整个循环，就可给循环起个名，直接break后跟一个起好的名就可以了for(var i=0; i<5; i++){ console.log(i); break;}（1）没有break: 依次进行循环（2）有break://输出的是i原有的值： 0（3）for(var i=0; i<5; i++){ con原创 2021-04-03 11:14:19 · 218 阅读 · 0 评论 -
JS的应用（如：JS特点、警告框，向页面输出内容、在控制台输出内容、标识符）
听课笔记：尚硅谷——JS基础JavaScript由ECMAScriptpt、DOM、BOM组成JS的特点1.解释型语言//不用编译，写完直接运行；2.类似于C和Java的语法结构3.动态语言//表示变量的值比较任意，可保存任意类型的数据；4.基于原型的面向对象5.JS中严格区分大小写编写代码的位置1.弹出一个警告框2.向页面中输出内容3.在控制台中输出内容<!DOCTYPE html><html> <head> <meta原创 2021-03-30 16:29:37 · 1166 阅读 · 0 评论 -
日期格式、JS数字、JS随机、JS逻辑、JS比较、条件三元运算符、JS条件、JS Switch、JS Loop For、
日期格式。。。。。。。。。。。。。。。JS数字1.Math.PI 返回圆周长与直径的比率：3.141592653589793<script>document.getElementById("demo").innerHTML = Math.PI;</script>2.Math.round(x) 返回 x 四舍五入到最接近的整数的值： document.getElementById("demo").innerHTML = Math.round(4.6); /原创 2021-03-30 15:32:31 · 178 阅读 · 0 评论 -
数组排列、数组迭代、JS日期
数组排列1.sort() 方法以字母顺序对数组进行排序 如果数字按照字符串来排序，则 "25" 大于 "100"，因为 "2" 大于 "1"。 所以sort() 方法在对数值排序时会产生不正确的结果//创建按钮<button onclick="myFunction()">试一试</button><p id="demo"></p><script>//输出原数组var fruits = ["Banana", "Orange"原创 2021-03-16 17:44:29 · 119 阅读 · 0 评论 -
数组方法
1，数组方法1.1 toString()把数组转换成字符串 以逗号分隔的字符串返回数组join也可以，join还可以以其他符号将其分开，比如join( " * " ) joi( " / " ) ,,,<script>var fruits = ["Banana", "Orange", "Apple", "Mango"];document.getElementById("demo").innerHTML = fruits.toString();</script>原创 2021-03-16 17:42:25 · 61 阅读 · 0 评论 -
用JavaScript改变Html（警告框、、、、、、）
用JavaScript改变Html1.改变Html的内容 .innerHTML<!DOCTYPE html><html><body><p id="demo">欢迎</p><button type="button" onclick='document.getElementById("demo").innerHTML = "Hello JavaScript!"'>点击我！</button><p>可原创 2021-03-10 16:44:12 · 480 阅读 · 0 评论