在实际工作中，我们很少会遇到一次性需要向页面中插入大量数据的情况，但是为了丰富我们的知识体系，我们有必要了解并清楚当遇到大量数据时，如何才能在不卡主页面的情况下渲染数据，以及其中背后的原理。
在 web 应用中，模拟编辑器或者模拟输入框中文字啪啦啪啦输入的效果，往往能够吸引人们的眼球，让用户的注意力聚焦在输入的内容上，其实使用的是 web 动画模拟打字机效果，本文将和大家探讨打字机效果的实现方式以及应用。
简述 JavaScript实现加载中...效果 开始 index.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>Documen
Vue2 源码从零详解系列文章， 还没有看过的同学可能需要看一下之前的，vue.windliang.wang/
简述 JavaScript实现加载中...效果 开始 index.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>Docum
本节讲Dom和Bom模型概念讲解(节点获取,window对象)。 out.js: 写了2个输出到页面的函数。
setTimeout(methodName, interval); //间隔时间单位为毫秒，表示interval毫秒后执行方法methodName
如果你需要首屏快的话，要用分页，其中requestAnimationFrame分页更为优秀，因为这个api会是系统调用的，刷新时机和屏幕刷新保持一致。setTimeout则不能保证一致。
本文简单利用定时器setTimeout和setInterval举了两个小栗子：定时炸弹和1-100递增
早之前有分享过vue的nextTick的使用，当时说当数据发生变化，更新后执行回调没有实现，那时候也不知道怎么测试的，其实nextTick方法只是做了一步异步。
最直接的方法就是直接渲染出来，但是这样的做法肯定是不可取的，因为直接渲染太耗性能了。
Logo尺寸 background-size：设置背景图片尺寸 background-size: 30px 30px; background-size: cover / contain; cover：保持图像的纵横比并将图像缩放成将完全覆盖背景定位区域的最小大小 contain：保持图像的纵横比并将图像缩放成将适合背景定付区域的最大大小 子绝父相 给nav-box相对定位(relative)，img绝对定位(absolute) 定时器 setTimeout let timer = setTimeout(函数
相信大家在写vue项目的时候，一定会发现一个神奇的api，Vue.nextTick。为什么说它神奇呢，那是因为在你做某些操作不生效时，将操作写在Vue.nextTick内，就神奇的生效了。那这是什么原因呢？
版权声明：本文为博主原创文章，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。
有时候执行异步任务可能是很困难的，尤其是在特定的编程语言不允许取消被错误启动或不再需要的操作时。幸运的是 JavaScript 提供了非常方便的功能来中止异步活动。在本文中，你可以学到如何创建可中止的函数。
都说今年是最惨工作年，大厂裁员，小厂跟风，简历投了几百封回信的寥寥无几，金三银四怕是成了铜三铁四，冷冷清清，凄凄惨惨。
很多文章都在讨论事件循环 (Event Loop) 是什么，而几乎没有人讨论为什么 JavaScript 中会有事件循环。博主认为这是为什么很多人都不能很好理解事件循环的一个重要原因 —— 知其然不知其所以然。所以本文试图抛砖引玉，从一些更溯源的方式来与大家探讨 event loop，希望大家能从中有些收获。
到这里我们已经讲了游戏的整体设计和实现。一个游戏要完整，还需要给它制定一个评分机制，它是整个游戏的关键所在。就好比一部电影，特效再好看，如果剧情狗血，那也是一部烂片。 相信大家都玩过一些简单但很吸引人的小游戏。比如很久以前微信上的打飞机，围住神经猫，还有前段时间大火的slither.io。他们都简单易玩，但却能让人肾上腺素飙升，百玩不腻。 所以一款好玩的小游戏必须具备了这样的特点，简单易玩，却能给人制造紧张感，有时还能利用一些攀比心理。本游戏也基本具备了这样的特点。 计分实现 游戏以秒数作为计分，随着时间的
BOM(Browser Object Model)浏览器对象模型，它使得JS能够与浏览器进行‘对话’（交互，通过JS对页面内容进行操作）。
副作用函数实际上就是一个执行了之后会影响其他地方的函数，以下面一个例子， effect 执行之后会读取 obj 的 text 值 ，然后将这个值写入到 dom 节点中。
最近在开发 LBMS 后台的图片上传时候遇到了同样的问题（大量图片同时请求时触发429限制）在这之前所使用的 valine 评论系统其中的一个 api 也是同样报错，原因很简单，leancloud 对同时发起大量查询做了限制处理，这直接导致默认请求数量过多时会返回 429 too many requests 错误，进而对操作造成一定的影响。
这篇文章介绍了如何使用font awesome图标字体库，使用动态图标，添加网页运行时间，全站变黑白，鼠标点击特效，网页标题的动态效果，网页樱花特效，鼠标触动音乐特效，之前还介绍过打字机效果，可以看看这篇文章
比如我们的「百度搜索」，搜索的时候有关键字的提醒，关键字的来源来自于客户端向服务端请求得到的数据，我们通过「keyup事件」去监听触发请求，如果返回值的搜索key已经不是搜索框现在的值，就丢弃掉这次返回，于是我们提出这样一个「优化需求」：「触发事件，但是我一定在事件触发n秒后才执行，如果你在一个事件触发的n秒内又触发了这个事件，那我就以新的事件的时间为准，n 秒后才执行」那么我们来动手实现我们的「第一版」的防抖函数吧：
实现渐隐渐现效果是比较常见的一种交互方式，通常的做法是控制display属性值在none和其它值之间切换，虽说功能可以实现，但是效果略显生硬，所以会有这样的需求——希望元素消失时具有平滑的效果。
前面用了几篇文章来跟大家分享什么是任务可中断，不过呢，可能是我介绍的方式太过于简单粗暴，以致于还是有部分同学没太明白，所以今天我就用最基础的方式重新跟大家分享一下什么是任务可中断
实现单行文字水平滚动，在网上看了一个vue插件 marquee-components
展开收起效果是比较常见的一种交互方式，通常的做法是控制display属性值在none和其它值之间切换，虽说功能可以实现，但是效果略显生硬，所以会有这样的需求——希望元素展开收起能具有平滑的效果。
油猴脚本是在沙盒里执行用户脚本，不会对网页注入script元素，它通过沙盒向网页中传递信息以达到控制dom的操作。所以如果要对脚本进行检测，没有像上面代码这样子向页面中植入iframe的话，通过去检测dom和window是无法检测出使用油猴脚本的。
网站标题自定义并滚动 // JS 代码实现网站标题自定义 <script type="text/javascript"> var sTitle = "这句话是网站页面的标题" function TitleMove(){ sTitle = sTitle.substring(1, sTitle.length) + sTitle.substring(0, 1); document.title = sTitle; status = sTitle; } window.setInterval("
前端框架中经常有「将多个自变量变化触发的更新合并为一次执行」的批处理场景，框架的类型不同，批处理的时机也不同。
<HTML> <HEAD> <TITLE>open代码</TITLE> <SCRIPT type=text/javascript>
① setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。setTimeout()方法接收两个参数，第一个参数是将要推迟执行的函数名或者一段代码，第二个参数是推迟执行的毫秒数。
注意是methods，后面有个s不要忘记了，一开始我直接写的method，就出了问题。
因为聊天框是被iframe框进去的页面,所以在聊天框中收到websocket消息以后要把消息发送给父集页面,在父页面中闪烁标题
BOM和DOM简介 BOM（Browser Object Model）是指浏览器对象模型，它使JavaScript有能力与浏览器进行“对话”。 DOM（Document Object Model）是指文档对象模型，通过它，可以访问HTML文档的所有元素。 Window对象是客户端JavaScropt最高层对象之一，由于window对象是其他大部分对象的共同祖先，在调用window对象的方法和属性时，可以省略window对象的引用。例如：window.document.write()可以简写成：documen
1.1 js同步执行与异步执行 js的执行机制：js是单线程环境，从上到下、依次执行，即 同步执行；在这段代码中，for循环是同步代码，setTimeout是异步代码。 js在执行代码的过程中，碰到同步代码会依次执行，碰到异步代码就会将其放入任务队列中进行等待，当同步代码执行完毕后再开始执行异步代码，即 异步执行。
首先，div元素块设置css变圆；其次，每隔一定时间，转换元素块背景色；接着，控制显示时长；然后，将上两步组合；最后，无限循环执行。
学习Three.js的时候,看到官方提供了很多很多的example,实在太多了,但并不是每个我都感兴趣,想去了解,但我又记不住每个链接对对应的效果是什么样的,于是我想,能不能把所有的案例用图片保存下来
1.location的用法和弹出框处理 location.href // 可以用于获取当前的URL location.href="http://www.baidu.com" // 这种组合可以跳转到指定的页面 alert("这是一个弹出框"); confirm("你确定吗？"); prompt("输入点什么吧"); 2.及时相关的行为 var t1 = setTimeout("alert('对不起, 要你久候')", 3000 ) // 第一个参数代表行为，第二个代表过多久执行这个动作 clearTim
ajax跨域问题 跨域 同源策略限制 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性。也就是说，受到请求的 URL 的域必须与当前 Web 页面的域相同。这意味着浏览器隔离来自不同源的内容，以防止它们之间的操作。 解决方式 通常来说，比较通用的有如下两种方式，一种是从服务器端下手，另一种则是从客户端的角度出发。二者各有利弊，具体要使用哪种方式还需要具体的分析。 服务器设置响应头 服务器代理 客户端采用脚本回调机制。 方式一 Access-Control-Allow-Origin 关键字只有在
介绍 闲来无事，去了CSS3Plus网站逛了逛，发现了一个很有意思的实现--css3实现进度条。粗略看了下代码，发现原理其实很简单，不难理解。 现在在此讲述下原理并实现一个1s更新的进度条。 技术细节是这样的：进度条由两个半圆环组成，首先我们的任务是实现左右两个半圆环。圆环可以用border-radius实现，这样就意味着该方 法不兼容IE8.可以使用clip来完成对整圆环的剪切；使用rotate函数完成圆环的旋转，通过设置两个半圆环的旋转角度来实现不同进度值的显示。 clip属性是css2属性
https://juejin.cn/post/6969028296893792286
将以下代码加入到 标签中。对于本主题，依次进入 控制台 - 外观 - 设置外观 - 主题自定义扩展，将代码加入到 自定义 HTML 元素拓展 - 标签: head 头部 (meta 元素后)，也可直接加入到主题对应的 header.php 中的 标签前。
之前有朋友问我博客里浏览器标签栏闪烁效果怎么做的 今天把代码贴出来吧 // 使用message对象封装消息 var message = { time: 0, title: document.title, timer: null, // 显示新消息提示 show: function () { var title = message.title.
写过几个油猴脚本，经常对页面请求返回的数据进行拦截或者覆盖，这篇文章就做个总结，涉及到 fetch 和 xhr 两种类型的请求。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
