你遇到过性能很差的网页吗？ 这种网页响应非常缓慢，占用大量的CPU和内存，浏览起来常常有卡顿，页面的动画效果也不流畅。 你会有什么反应？我猜想，大多数用户会关闭这个页面，改为访问其他网站。作为一个开发
这种网页响应非常缓慢，占用大量的CPU和内存，浏览起来常常有卡顿，页面的动画效果也不流畅。
节前在支援一些移动页面的时候，遇到了蛮多的TouchEvent相关的问题，趁着假期一一验证一下。
CSS 提供了对多列布局的支持。支持设置布局中的列数 (column-count)、内容应如何列之间的流动规则、列之间的间距 (column-gap) 以及列分割线（column-rule）的样式。
全文参考：https://github.com/iuap-design/blog/issues/38 、MDN
每年的苹果新产品发布，其官网都会配套更新相应的单页滚动产品介绍页。其中的动画特效都非常有意思，今年 iPhone 14 Pro 的介绍页不例外。
BFC 就是块级格式上下文，是页面盒模型布局中的一种 CSS 渲染模式，相当于一个独立的容器，里面的元素和外部的元素相互不影响。那么首先先来说一下常见的三种控制布局的定位方案
站长建议：视频只是作为知识点补充，不要一开始就直接看视频，最好是在阅读之后，带着疑问去看视频。
熟悉了 Vue 的指令系统后，在实际开发中，不可避免的会使用到对于事件的操作，如何处理 DOM 事件流，成为我们必须要掌握的技能。不同于传统的前端开发，在 Vue 中给我们提供了事件修饰符这一利器，使我们可以便捷的处理 DOM 事件，本章，一起来学习如何使用事件修饰符来实现对于 DOM 事件流的操作。
不久前在HackPWN的启动仪式上，安全人员仅用2分钟就通过无线钥匙破解了一辆奔驰汽车，看起来黑客要偷走一辆汽车很容易。真的这么简单吗？作为无线安全研究者，在这里给大家做一点简单的汽车无线钥匙通信安全的科普。 先从汽车无线钥匙的“信号”长什么样说起吧？ 常见的汽车无线钥匙一般工作在两个频点，315MHz和433MHz。调制方式比较常见的有两种，ASK和FSK。复杂一点的有双频点FSK，还见过多频点ASK的。 可以用俗称电视棒的一种小硬件来观察汽车钥匙的无线信号。在网络上搜索“RTLSDR”,”电视棒”，就可
现代浏览器探秘(part1)：架构 现代浏览器探秘(part2)：导航 现代浏览器探秘(part3)：渲染
浅谈JavaScript中scrollTop、scrollHeight、offsetTop、offsetHeight
注：一般实际工作来说标签不需要进行转换，因为大多数情况下都可以选择对应的标签来实现需求 行内块较为特殊！！
让 border-radius属性的值等于盒子高度的一半就行(当然，盒子得是正方形才能得到圆，否则便不是圆)
在做大部分真实应用的 web 项目过程中，都会有一样不可或缺的需求，那就是分页。Meteor 项目也不例外，同样会有这样的需求，本文给大家介绍的就是一个非常好用的分页包 alethes:pages。它可以实现简单的根据页数分页，也可以实现强大的滚动分页。内部还支持利用多个 collection 数据进行分页。下面我们就来详细的了解它。 注意：以下内容多是对官方包的一种简述和翻译，如果需要更详细的内容可以参考官方地址。
我们在上面《页面分类》的项目中，对 tap 事件的处理使用的是 touch 事件处理的，因为如果使用 click 事件的话，总会有延时。
静态定位是所有元素的默认定位方式，当position属性的取值为static时，可以将元素定位于静态位置。 所谓静态位置就是各个元素在HTML文档流中默认的位置。
图片资源，在我们的业务中可谓是占据了非常大头的一环，尤其是其对带宽的消耗是十分巨大的。
本文章将介绍如何使用Python的Selenium库和正则表达式对CSDN的活动文章进行爬取，并将爬取到的数据导出到Excel文件中。
序言 前端路由一直都是我们单页面模式开发的重要组成部分，平时开发中会遇到路由的两种模式hash和history,只知道history模式下刷新页面会 404，显示在页面上没有hash的#那么丑陋，那
大家好，我是 ConardLi，一年一度的 CSS年度报告 如期而至，我挑了一些我感兴趣的部分，和我一起来看看吧～
当父子元素中都有点击事件的时候，为了让触发子元素中的事件时，不去触发父元素中的事件，可以在子元素事件中添加stop来阻止事件冒泡。
解决在vscode中react标签代码不提示的问题： 1、作为一个刚开始的react小白，一定有vscode中标签代码不自动提示的烦恼吧： （如下两图，再输入div及input标签的时候没有任何提示，能看到我这个文章的八成就是前端了，都习惯了代码自动补全，突然需要自己手打标签是非常不习惯了，这和在文本文档里面写代码没什么两样） 📷 📷 综上所述，可以看到在react中输入div及input标签不会有任何提示 2、这时只需要在设置里添加此项就可以了，复制搜索emmet.includeLanguages，加入
shape-outside 是一个允许设置形状的 CSS 属性。它还有助于定义文本流动的区域：
前端的业务开发中会遇到一些不分页且数据条数超过1000加载的列表（长列表），不分页的需求在一般前端程序员看来是不可思议的。正常的思考逻辑是，当数据量20w+时，后端报文可去到30+M,查询时间可能去到几十秒。但是前端如果尝试渲染这些数据，花费的时间必定是以分钟计算。通常是3分钟以上。相比之下，由前端优化这个问题更为迫切，责任更为突出（锅更大）。
由于网页的执行都是单线程的，在JS执行的过程中，页面会呈现阻塞状态。因此，如果JS处理的数据量过大，过程复杂，可能会造成页面的卡顿。传统的数据展现都以分页的形式，但是分页的效果并不好，需要用户手动点击下一页，才能看到更多的内容。 有很多网站使用 无限分页 的模式，即网页视窗到达内容底部就自动加载下一部分的内容... 本篇就无限分页的实现模型，讲述其中奥妙。 原理图 实现无限分页的过程大致如下： 1 视窗滚动到底部 2 触发加载，添加到现有内容的后面。 因此，可能会出现两种情况： 1 当页面的内容很
之前在前端的时候有遇到这样一个问题，实现 JS 图片的循环滚动，然后鼠标移入的时候停止滚动，鼠标移开继续滚动，这里无非就是设置了一个定时器，鼠标移上时清除定时器达到滚动停止的目的，鼠标移开时重设定时器，代码如下：
CSS 锚点定位是一项强大的新功能，可用于创建各种交互元素，例如工具提示、模式和弹出窗口。它使工具提示更加动态。这是一个小示例，展示了如何锚定定位以创建工具提示：
通过阅读本文,你可以通过css 中overcroll-behavior属性值的设置,处理浏览器溢出滚动,以及禁用移动设备上刷新,下拉滚动时的发光和橡皮圈回弹效果,当然也可以看到css中 Houndini(胡迪宁),也就是css中也可以写变量等知识,如果文有误导的地方,欢迎路过的老师拍砖指正
Emmet语法的前身是Zen coding,它使用缩写,来提高html/css的编写速度, Vscode内部已经集成该语法。 快速生成HTML结构语法 快速生成CSS样式语法
随着软件行业的不断发展，历史遗留的程序越来越多，代码的维护成本越来越大，甚至大于开发成本。而新功能的开发又常常依赖于旧代码，阅读旧代码所花费的时间几乎要大于写新功能的代码。 我前几天看了一本书，书中有这么一句话： “复杂的代码往往都是新手所写，只有经验老道的高手才能写出简单，富有表现力的代码” 此话虽然说的有点夸张，可是也说明了经验的重要性。 我们所写的代码除了让机器执行外，还需要别人来阅读。所以我们要写： 让别人能读懂的代码 可扩展的代码 可测试的代码(代码应该具备可测试性，对没有可测试性的代码写测试，
谷歌的数据表明，一个有 10 条数据 0.4 秒可以加载完的页面，在变成 30 条数据加载时间为 0.9 秒后，流量和广告收入减少了 20%。当谷歌地图的首页文件大小从 100kb 减少到 70~80kb 时，流量在第一周涨了 10%，接下来的三周涨了 25%。
在 iOS Safari （其他浏览器和 Android 均不会）上会对那些看起来像是电话号码的数字处理为电话链接，比如：
在 CSS 规范 Scroll-linked Animations 中，推出了一个划时代的 CSS 功能。也就是 -- The @scroll-timeline at-rule，直译过来就是滚动时间线。
作者：Ahmad 译者：前端小智 来源：ishadee 本文 GitHub https://github.com/qq449245884/xiaozhi 已收录，有一线大厂面试完整考点、资料以及我的
文档对象模型（DOM）提供了许多强大的功能，在现代浏览器中无需外部依赖即可使用。在本文中，我们将探讨8个可能被忽视的DOM功能
除了 classList.contains 方法之外，还有一个 node.contains 方法，这个方法返回的是一个布尔值，来表示传入的节点是否为该节点的后代节点。语法：
在移动端 WEB 开发的时候（小程序也雷同），如上录屏所示，如果页面超过一屏高度出现滚动条时，在 fixed 定位的弹窗遮罩层上进行滑动，它下面的内容也会跟着一起滚动，看起来好像事件穿透到下面的DOM元素上一样，我们姑且称之为滚动穿透。
在新闻网站中大多采用的是异步加载模式，新闻条目会随滚动条的滚动而逐渐加载。当爬虫访问这类网站时得到的HTML数据仅仅是我们看到的页面数据，只有当我们向下滚动时，网页的源代码才会同步更新。例如：腾讯新闻，处理这类JS异步加载的问题，这里用selenium来解决。
默认情况下，HTML元素都在标准流中呈现和展示。我们之前把元素分为块级元素，行内元素，行内块级元素，他们的特性是块级独占一行，行内和行内块级可以在一行内共存，这些特性都是针对标准流的。总结一下就是，标准流中元素只能在水平或垂直方向上排版。如果元素是块级元素, 那么就会垂直排版，如果元素是行内元素/行内块级元素, 那么就会水平排版。
最近开源了一个 Vue 组件，还不够完善，欢迎大家来一起完善它，也希望大家能给个 star 支持一下，谢谢各位了。
滚动条是图形用户界面（UI）中必不可少的组件。滚动条允许用户查看超出其容器宽度或高度的内容。滚动条还使用户能够查看超出屏幕宽度或高度的内容。默认情况下，浏览器会为body内容的溢出包含一个滚动条。在其他情况下，UI开发人员必须设置滚动条以使用户能够查看超出屏幕或特定容器的内容。每个浏览器都有一组默认的滚动条样式。在某些情况下，您可能有充分的理由来定制滚动条。例如，您可以定制滚动条样式以匹配网站的外观和感觉。
设置 display: block 可以显示元素 , 同时该样式还可以将元素转为块元素 ;
如果你构建一个很有特色和创意的网页，那么肯定希望定义网页中的滚动条样式，这方面的 jQuery 插件比较不错的，有两个：jScrollPane 和 mCustomScrollbar。
title: 向Zepto学习关于偏移的那些事 date: 2017-12-10 23:06:15
看到这个标题就懵了， 你会有以下几个问题：什么是防抖？ 什么是节流？ 如何使用防抖？ 如何使用节流？ 什么时候需要用到防抖和节流？ 为什么要用防抖和节流？ 那我们就围绕这几个问题来讲一讲防抖与节流的两个概念和简单应用吧~ 我会在正文中给大家逐个解答问题
根据文章内容总结的摘要
尽管DOM作为API已经非常完善了，但是为了实现更多的功能，仍然会有一些标准或专有的扩展。对DOM的两个主要扩展是Selectors API（选择符API）和HTML5。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储
