08 2020 档案
摘要：需求 当用户在a页面点击按钮时跳转到b页面，如果b页面还未打开，则在新窗口中打开b页面；如果b页面已经打开，则刷新b页面。 代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</ti
阅读全文
摘要：遍历map对象 遍历map对象时适合用解构,例如： for (var [key, value] of phoneBookMap) { console.log(key + "'s phone number is: " + value); } 当你为对象添加myObject.toString()方法后，
阅读全文
摘要：一、for in和for of for in for...in语句以任意顺序遍历一个对象的除Symbol以外的可枚举属性。 for in遍历数组的问题 index索引并不是一个数字,而是一个String,不能直接进行几何运算,容易误操作为字符串计算。 遍历顺序有可能不是按照实际数组的内部顺序。 使用
阅读全文
摘要：方法一 Object.keys() 通过ES6新增的一个Object.keys()方法 该方法会返回一个由给定对象自身的（不含继承的）可枚举（enumerable ）属性组成的数组，数组中属性名的排列顺序和使用 for...in.. 循环遍历该对象时返回的顺序一致 。即可以通过返回数组的长度来判断是
阅读全文
摘要：例如我们希望输出的数字长度是固定的，假设为5，如果数字为123，则输出00123，不够位数就在之前补足0，这里提供了三种不同的方式实现JS代码给数字补0 的操作。 方法一 function PrefixInteger(num, length) { return (num/Math.pow(10,le
阅读全文
摘要：问题 这个问题大部分时候也不会遇到。 我是在修改博客样式时，文章结尾处会有标签分类，如下图： 源代码： <div id="BlogPostCategory"> 分类 <a href="" target="_blank">HTML</a> </div> 由于本人觉得“分类”这几个字太丑，想要实现如下的
阅读全文
摘要：1.返回控制与函数结果的情况 return 表达式; 该语句结束当前函数执行，返回调用的函数，而且把表达式的值作为函数的结果输出。 2.返回控制ture和false的情况 无函数结果 return true; 相当于执行符。 return false; 相当于终止符。它的作用一般是用来取消默认动作的
阅读全文
摘要：限定开头 文档上给出了解释是匹配输入的开始，如果多行标示被设置成了true，同时会匹配后面紧跟的字符。 比如： /^A/会匹配"An e"中的A，但是不会匹配"ab A"中的A 取反（否） 当这个字符出现在一个字符集合模式的第一个字符时，他将会有不同的含义。 比如： /[a-z\s]/会匹配"my
阅读全文
摘要：本文实例为大家分享了js实现列表向上无限滚动的具体代码，供大家参考，具体内容如下： 在项目中有用到需要无限向上滚动，循环中奖手机号码，实现代码如下： html： <h5>恭喜以下中奖用户！</h5> <div class="list_bg"> <ul class="customer_list"></
阅读全文
摘要：window的location对象 window.location.href 整个URl字符串(在浏览器中就是完整的地址栏) window.location.protocol URL 的协议部分。返回值：http: window.location.host URL 的主机部分(带端口号) windo
阅读全文
摘要：什么是伪元素 伪元素用于向某些选择器设置特殊效果。 已存在元素是指DOM中存在的，伪元素则是虚拟的一种，样式也是给这个虚拟的元素使用的。 比如伪元素 :before和:after，用于在CSS渲染中向元素的头部或尾部插入内容，它们不受文档约束，也不影响文档本身，只影响最终样式。这些添加的内容不会出现
阅读全文
摘要：forEach() 用于遍历数组，无返回值 1.基础点 forEach的使用频率很高，多用于对数组自身的改变和各元素相关统计性的计算，重要特性如下： 可以改变数组自身，没有返回值； 中途不能用常规操作跳出循环，可以用抛出异常（try/catch）的方式，但不推荐这样做； 2.易错点 forEach(
阅读全文
摘要：原文： 切换选项卡时，保留复选框勾选(1) 更新内容：将选项卡显示隐藏做了封装等，考虑了更多选项卡的情况，有待更优解~~ 更新后代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</ti
阅读全文
摘要：前几天写过一篇 用js将HTML重新排序 的文章，其中用到sort来排序。 那么，我们先来回顾下sort的用法： 回顾 Array.prototype.sort() 方法 用原地算法对数组的元素进行排序，并返回数组。默认排序顺序是先将元素转换为字符串，然后比较它们的UTF-16代码单元值序列时构建的
阅读全文
摘要：项目中遇到了这个问题，说实话 iOS 端问题挺多的，原因找起来比较简单，就是吊起键盘的时候把window的高度挤小了， 然后，关掉键盘页面高度没恢复，底下出现空白区域,并导致光标位置错乱,再次点击输入框区域时无法focus；安卓手机会自动恢复页面高度。 原因找到了就想解决办法，刚开始想的是 iOS
阅读全文
摘要：在开发的过程中，经常遇到获取到的是类数组对象，比如DOM集合,nodeList，以及classList也是类数组。 有时我们需要类数组去调用数组的方法，怎么办？ 1.遍历类数组，将元素依次放入空数组 var data=document.querySelectorAll("li"); var divL
阅读全文
摘要：问题 最近一个页面中用到appendChild来追加内容，此时发现当多次添加相同的li标签时，页面上却只出现了一个li标签。 <ul id="mylist"></ul> <script> const mylist = document.getElementById('mylist'); const
阅读全文
摘要：问题 下面代码中，使用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
阅读全文
摘要：需求 想要实现如图的效果，li宽度相等，并且自适应ul的宽度。 li个数不是固定的，图中一行为9个li，当屏幕宽度变小，可能会8个或更少，但在屏幕宽度变化的过程中，要保持li的宽度相等并且始终充满ul的宽度。 解决 使用了媒体查询来实现效果，上代码： <!DOCTYPE html> <html la
阅读全文
摘要：需求 项目中遇到一个需求，点击不同的选项卡，显示不同的数据，显示的数据为多个复选框不等， 如图所示，点击“数据1”即显示data1中的数据，点击“数据2”即显示data2中的数据，且要求两个选项卡中的复选框勾选互不影响。 问题 最初采用的方式为，点击“数据1”使用data1的数据渲染到class为c
阅读全文
摘要：平时经常用到JSON.parse将JSON字符串转换为对象格式， 但有时会遇到不规范的字符串，比如： '{test: 1}' （ test 没有包围双引号） '{'test': 1}' （使用了单引号而不是双引号） 如果将上面的字符串传入JSON.parse,会抛出异常。 那么我们就可以使用Eval
阅读全文
摘要：偶然发现有些网站在用户登陆时，在输入密码的过程中先看到输入的密码，延迟后再变成密文，很好奇，所以捣鼓了一下。 明文延迟转密文 以下为代码：（延迟后变成*号） //js实现输入密码后，先显示当前输入的一位密码，然后再变成星号 <input class="ipt" type="text"> <scrip
阅读全文
摘要：有这样一个数组arr，让每个对象的num1相加， num2相加， num3相加， 然后返回得到3个数。即num1的总和，num2的总和， num3的总和。 方法如下： let arr = [ {id: 1, num1: 10, num2: 20, num3: 30}, {id: 2, num1: 1
阅读全文
摘要：根据页面是否加载完毕来关闭loading效果： 首先，我们要想知道页面是否加载完毕，需要知道以下几点： 1.document.onreadystatechange 页面加载状态改变时的事件 2.document.readyState 页面当前文档的状态 1）.uninitialized 还未开始载入
阅读全文
摘要：移动端的导航栏需要滑动到一定距离，固定在页面顶部（即fixed定位），此时要让导航栏内的选项卡横向滑动， 效果如图 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title>
阅读全文
摘要：1. 开闭区间 这个首先我们得弄明白 Math.random() 的范围和开闭区间问题吧？文档是有说明的，它是 [0, 1) 区间的。 2. 区间的移动和缩放 平移使用加减，缩放乘以系数。 //取得(n,m]范围随机数 function leftOpen(n,m) { var result = Ma
阅读全文
摘要：看到的一个关于类型转换的题目： 对象 ab 是两个字面量函数，在进行比较的时候，可以发现大小和相等的比较结果都是 false： var a = {b: 42}; var b = {b: 43}; a < b; //false a == b; //false a > b; //false a <= b
阅读全文
摘要：jQuery的出现，大大简化了对dom的操作，但是如果不是仔细阅读api和进行操作，就不知道其中最大的优点和使用方式。就拿$().click()和$(document).on('click','要选择的元素',function())来说，都是点击事件的操作，但是也有不同的地方。 1. $(选择器).
阅读全文
摘要：CSS Tree 功能介绍： 将Html 文档结构直接生成对应 css, sass, less 组织结构 使用方法： 安装 css tree 插件 选中对应的html文档结构 ctrl+shift+p 选择Generate css tree
阅读全文
摘要：禁用长按选择文字功能 body { user-select: none; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; } 禁止长按弹出菜单 (未实际验证) node.addEventListener
阅读全文
摘要：需求 在做响应式页面的时候有这样的需求，要求div的宽高等比例放大或缩小。 我们先放图片： 要做一排方形的div，放不下时自动换行。 代码 HTML： <div class="container"> <ul> <li> <div class="inner">1</div> </li> <li> <d
阅读全文
摘要：1.cookie中存值 function setCookie (name, value) { if (value) { var Days = 365; var exp = new Date(); exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 10
阅读全文
摘要：移动端项目中获取手机验证码的操作，其中引用到jquery-2.2.4.min.js和jquery.mobile.custom.min.js，先上代码： <input class="code_btn" type="button" value="获取验证码" /> js（问题代码）: /* 点击获取验证
阅读全文
摘要：在做项目的时候发现苹果手机的safari浏览器下 如果在点击软键盘上的验证码自动填充之后输入框input就会自动变成黄色 查询原因如下： 浏览器会自动加上 方法一 在之前input输入框有记录的情况下，会出现自动填充输入框背景颜色变成如上黄色，最简单的方法是禁止输入框自动填充。 <input typ
阅读全文
摘要：默认情况下： 点击后，按钮有了diasbled属性， css代码： .disabledCodeBtn { border: 1px solid #fff; font-weight: bold; color: #fff; background-color: #c53b40; } 理想状态为按钮背景色变暗
阅读全文
摘要：之前做注册登录界面遇到过一个需求，输入框的颜色和光标都变为红色。 设置文本的颜色方便，但光标该怎么设置颜色？CSS3 的 caret-color 可以解决这个问题。 input, textarea { caret-color: blue; } 它不仅对于原生的输入控件有效，对设置 contented
阅读全文
摘要：css中给body或者目标元素设置 -webkit-tap-highcolor:transparent;
阅读全文
浙公网安备 33010602011771号