摘要: 问题 下面代码中,使用js将li按照data-id来重新排序。 <ul id="mylist"> <li data-order="2">item2</li> <li data-order="3">item3</li> <li data-order="1">item1</li> </ul> 方法一 c 阅读全文
posted @ 2020-08-20 17:19 ZerlinM 阅读(568) 评论(0) 推荐(0)
摘要: 需求 想要实现如图的效果,li宽度相等,并且自适应ul的宽度。 li个数不是固定的,图中一行为9个li,当屏幕宽度变小,可能会8个或更少,但在屏幕宽度变化的过程中,要保持li的宽度相等并且始终充满ul的宽度。 解决 使用了媒体查询来实现效果,上代码: <!DOCTYPE html> <html la 阅读全文
posted @ 2020-08-20 14:27 ZerlinM 阅读(1043) 评论(0) 推荐(0)
摘要: 需求 项目中遇到一个需求,点击不同的选项卡,显示不同的数据,显示的数据为多个复选框不等, 如图所示,点击“数据1”即显示data1中的数据,点击“数据2”即显示data2中的数据,且要求两个选项卡中的复选框勾选互不影响。 问题 最初采用的方式为,点击“数据1”使用data1的数据渲染到class为c 阅读全文
posted @ 2020-08-20 10:09 ZerlinM 阅读(434) 评论(0) 推荐(0)
摘要: 平时经常用到JSON.parse将JSON字符串转换为对象格式, 但有时会遇到不规范的字符串,比如: '{test: 1}' ( test 没有包围双引号) '{'test': 1}' (使用了单引号而不是双引号) 如果将上面的字符串传入JSON.parse,会抛出异常。 那么我们就可以使用Eval 阅读全文
posted @ 2020-08-20 08:31 ZerlinM 阅读(1106) 评论(0) 推荐(0)
摘要: 偶然发现有些网站在用户登陆时,在输入密码的过程中先看到输入的密码,延迟后再变成密文,很好奇,所以捣鼓了一下。 明文延迟转密文 以下为代码:(延迟后变成*号) //js实现输入密码后,先显示当前输入的一位密码,然后再变成星号 <input class="ipt" type="text"> <scrip 阅读全文
posted @ 2020-08-20 08:26 ZerlinM 阅读(1268) 评论(0) 推荐(0)
摘要: 有这样一个数组arr,让每个对象的num1相加, num2相加, num3相加, 然后返回得到3个数。即num1的总和,num2的总和, num3的总和。 方法如下: let arr = [ {id: 1, num1: 10, num2: 20, num3: 30}, {id: 2, num1: 1 阅读全文
posted @ 2020-08-19 18:33 ZerlinM 阅读(1692) 评论(0) 推荐(0)
摘要: 根据页面是否加载完毕来关闭loading效果: 首先,我们要想知道页面是否加载完毕,需要知道以下几点: 1.document.onreadystatechange 页面加载状态改变时的事件 2.document.readyState 页面当前文档的状态 1).uninitialized 还未开始载入 阅读全文
posted @ 2020-08-19 18:21 ZerlinM 阅读(1373) 评论(0) 推荐(0)
摘要: 移动端的导航栏需要滑动到一定距离,固定在页面顶部(即fixed定位),此时要让导航栏内的选项卡横向滑动, 效果如图 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> 阅读全文
posted @ 2020-08-19 14:27 ZerlinM 阅读(724) 评论(0) 推荐(0)
摘要: 1. 开闭区间 这个首先我们得弄明白 Math.random() 的范围和开闭区间问题吧?文档是有说明的,它是 [0, 1) 区间的。 2. 区间的移动和缩放 平移使用加减,缩放乘以系数。 //取得(n,m]范围随机数 function leftOpen(n,m) { var result = Ma 阅读全文
posted @ 2020-08-19 14:05 ZerlinM 阅读(486) 评论(0) 推荐(0)
摘要: 看到的一个关于类型转换的题目: 对象 ab 是两个字面量函数,在进行比较的时候,可以发现大小和相等的比较结果都是 false: var a = {b: 42}; var b = {b: 43}; a < b; //false a == b; //false a > b; //false a <= b 阅读全文
posted @ 2020-08-18 08:34 ZerlinM 阅读(615) 评论(2) 推荐(0)