- 博客(22)
- 收藏
- 关注
RSS订阅原创 JavaScript产生指定范围内的一个随机数；以及用其解决编程题”函数 fn，该函数有一个参数 n，其返回值是一个数组，是 n 个随机且不重复的整数，且整数取值范围是 [2, 32]“
产生一定范围内的随机数，这是原生JavaScript中没有的函数，所以要自己实现（支持小数范围，但返回是还是整数）原理：利用内置对象Math的random，floor，ceil方法random方法：产生一个0~1之间的随机数（不包括1）floor方法：向下取整ceil方法：向上取整ok，下面开始封装为函数function fn(min,max){ min = Math.ceil(min); max = Math.floor(max); // 小的取大，大的取小，之后再+1
2021-05-12 16:09:29
228
原创 JavaScript如何获取网页的宽高，以及如何兼容（各种坑详解）
很多场景下会需要获取当前网页的宽高来达到一些效果，但是获取网页的宽高这里面还是有一点（hen duo）坑的，这里我进行了总结和详解，若有补充欢迎评论补充~方式一：window.innerWidth / window.innerHeight这种方式只支持IE9以及以上版本的浏览器网页高度，打开F12控制台当然高度会不同方式二：document.documentElement.clientWidthconsole.log(document.documentElement);console.lo
2021-05-10 11:36:01
329
1
原创 20分钟搞懂JavaScript事件冒泡：事件冒泡原理，事件委托（即事件冒泡的利用），以及阻止事件冒泡
事件冒泡事件的三个阶段：捕获，执行当前，冒泡三个阶段只有两个会同时进行，即捕获+当前，或者当前+冒泡注意：不是所有的事件都会冒泡，focus，load，unload等就不会冒泡三种添加事件方式都默认是冒泡，其中addEventListener第三个参数设置为true时，事件会变为捕获事件委托（事件冒泡的利用）运用场景：多个子元素触发同一类型的事件原理：利用冒泡，把事件添加在父元素上，然后用事件对象的target属性确定是哪一个子元素触发的。eg：tab选项卡 <style&
2021-05-09 23:11:58
536
1
原创 JS事件小记-添加事件的三种方式及其注意点（兼容写法）
<body> <div>123</div> <script> let oDiv = document.querySelector('div'); // 方式一 oDiv.onclick = function(){ alert('a'); } // 方式二 oDiv.addEventListener('click',functi
2021-05-09 21:12:43
174
原创 JavaScript手写颜色选择器（详细但简单！！！）
先直接上效果图~手写的原理就是：颜色是 “#” + “十六进制” 组成，所以用循环让其自由组合，就可以得到各种颜色的十六进制，再JS设置背景颜色和点击事件就可以了。CSS就不上了，HTML和JS整这里：<body> <div class="content"> <div class="divColor"> <script type="text/javascript"> var
2021-05-09 20:32:50
346
原创 微信小程序——选择图片/拍照
使用的微信API：1、选择图片：wx.chooseImage2、图片全屏预览：wx.previewImage超级简单，就把这两个API看一看，然后根据需求编写就OK了WXML：<view class="photo_box"> <view wx:if="{{photo_src != ''}}" class="photo_preview"> <image src="{{photo_src}}" mode="aspectFit" bindtap="photo_p
2020-08-19 09:22:51
3937
1
原创 伪类中序选择器的理解
最近复习基础，啃啃CSS权威指南，发现选择器相关知识点有些忽视和遗忘了，这里记录一下1、伪类:first-child，和 :first-of-type，:last-child，和 :last-of-typep:first-child只选择是p标签且同层级中p为第一个时，才设置p:first-of-type选择同层级中所有p标签的第一个last-child,last-of-type同理child，孩子，所以先选出同层级的第几个，再判断是不是那个种类；of-type，种类，所以是同层级中同类
2020-07-27 11:32:34
119
1
原创 微信小程序分包加载学习
1、为什么要分包加载不用分包：第一次打开要加载所有代码，时间太久使用分包：不用加载所有代码，在用户使用的时候根据其需求进行加载对应的分包即：在小程序启动时，默认会下载主包并启动主包内页面，当用户进入分包内某个页面时，客户端会把对应分包下载下来，下载完成后再进行展示。所以：对小程序进行分包，可以优化小程序首次启动的下载时间，以及在多团队共同开发时可以更好的解耦协作。注意：整个小程序所有分包大小不超过 16M单个分包/主包大小不能超过 2M...
2020-06-13 14:50:57
1210
原创 微信小程序如何用setData方法修改data中对象的属性值，数组的某一项的值
1、先用一个变量，把表示对象的属性值（字符串）或数组的某一项的值（字符串拼接起来）。2、将变量写在[]里面即可修改：普通，对象的属性值，数组的某一项值，对象与数组结合：js：Page({ data: { // 普通： text1:1, // 对象的属性值： text2:{ text2_1:2, }, // 数组： text3:[3,3,3], // 数组和对象结合： text4:[ {
2020-05-31 08:55:50
9649
原创 微信小程序保存失败:Error: ENOENT: no such file or directory, open XXX...
记录一个小问题：
2020-05-30 17:50:17
4942
1
原创 怎么关闭电脑开机自动启动的程序
在Window10中是这样：1、按下Win+r组合键，在运行对话框中输入命令msconfig2、在启动中点击==“打开任务管理器”==，找到不想开机自动启动的程序3、鼠标右击选择“禁用”即可
2020-05-19 07:42:56
594
原创 CSS预处理器篇学习-01 LESS
CSS是一门非程序式的语言, 没有变量/函数/作用域等概念，需要书写大量看似没有逻辑的代码, 不方便维护及扩展, 也不利于复用。所以，CSS预处理器就是升级版CSSCSS 预处理器就是用某一种语言用来为 CSS 增加一些动态语言的的特性(变量、函数、继承等)，CSS预处理器可以让你的 CSS 更见简洁，适应性更强，代码更直观等诸多好处1、体验LESSLESS就是一种CSS预处理器什么是...
2020-05-08 10:48:44
699
原创 一个小问题：小程序 Page "pages/Index/Index" has not been registered yet.
或者：还有！！！网上有些代码就是坑，page:({xxxxxxxxxx})首先P大写，而且没有“:”
2020-04-28 18:40:31
7457
原创 JS中函数和方法的区别，以及它们里面的this是啥
1.什么是函数?函数就是没有和其它的类显示的绑定在一起的, 我们就称之为函数2.什么是方法?方法就是显示的和其它的类绑定在一起的, 我们就称之为方法3.函数和方法的区别3.1函数可以直接调用, 但是方法不能直接调用, 只能通过对象来调用3.2函数内部的this输出的是window, 方法内部的this输出的是当前调用的那个对象4.无论是函数还是方法, 内部都有一个叫做this的东东...
2020-04-01 11:30:07
334
原创 ES6的let和之前的var，以及预解析的规则
在JavaScript中定义变量有两种方式ES6之前: var 变量名称;ES6开始: let 变量名称;区别： 1.通过var定义变量,可以重复定义同名的变量,并且后定义的会覆盖先定义的 var num = 123; var num = 456; console.log(num); //456 如果通过let定...
2020-04-01 10:49:05
724
原创 微信小程序上传，以及设置为体验版
点击工具里面有上传之后去登录小程序后台再下滑这里可以设置有个情况，上传了之后在开发版本里面没看到是appID不一致查看appID：然后复制，去给开发者工具的appID改为一致这个时候再上传，就可以在版本管理里面看到了...
2020-03-03 21:15:38
5308
原创 JavaScript篇---星空背景（有很多小细节和小知识点）
先来看一下效果吧星星闪耀，大小不一；鼠标hover时会放大旋转只需要一张静态的星星图片，就可以通过JS和CSS结合实现这样的效果虽然有些细节，但还是比较简单的<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title<...
2020-01-11 11:57:11
476
原创 CSS篇-05 Flex布局基础讲解（三、换行对齐的理解，以及伸缩项的排序）
默认不会换行<style> *{ padding: 0; margin: 0; } ul{ list-style: none; width: 600px; height: 500px; bord...
2019-12-20 20:38:01
1380
原创 CSS篇-04 Flex布局基础讲解（二、实现垂直居中）
先直接上代码~<style> *{ padding: 0; margin: 0; } ul{ list-style: none; width: 700px; height: 500px; bor...
2019-12-20 17:22:50
299
原创 CSS篇-03 Flex布局基础讲解（一、主轴与侧轴的改变和对齐）
先了解几个东西：1、伸缩容器和伸缩项<ul> <li>1</li> <li>2</li> <li>3</li></ul>我想让li在ul中布局；这里ul是伸缩容器，li是伸缩项2、伸缩容器的主轴和侧轴默认情况下：主轴起点为左，终点为右。侧轴起点为上，终点为下。...
2019-12-20 16:57:30
4302
原创 CSS篇-02 背景图片如何自适应
背景图片如何自适应，不管屏幕尺寸改变都可以正常显示，不留白也不重复首先，如果是给整个屏幕设置背景图的话，最好不要给body设置背景，body权重大所以：即使是整个屏幕，也别给body设置背景，宁愿写个最大的div包住所有，给这个div设置背景，也不要给body设置！！好了，直接上代码~ <style> .lll{ position...
2019-12-18 20:33:07
2317
原创 CSS篇-01width:100%和width:auto区别
CSS第一篇：width:100%和width:auto先了解一些基础~div不设置宽度的话，那么width为auto，即auto为默认。div的width在默认情况设置的是盒子模型中content的值。区别：div的width为100%表示的是此div盒子内容部分的宽度为其父元素的宽度也就是说：width:100%时子元素的content宽度等于父级的content宽度 d...
2019-12-17 21:35:26
655
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人