文章分类 - JavaScript
摘要：lighthouse 是 Google Chrome 推出的一款开源自动化工具，它可以搜集多个现代网页性能指标，分析 Web 应用的性能并生成报告，为开发人员进行性能优化的提供了参考方向。 使用入门 在 Chrome DevTools 中使用 比较推荐的方法。我们可以直接打开调试面板中的 “Ligh
阅读全文
摘要：在前端开发中，对于自己开发的app或者web page性能的好坏，一直是让前端开发很在意的话题。我们需要专业的网站测试工具，让我们知道自己的网页还有哪些需要更为优化的方面，我自己尝试了一款工具：Lighthouse，感觉还不错，记录下来，也顺便分享给用得着的伙伴。 Lighthouse分析web应用
阅读全文
摘要：目前主流的浏览器中已经禁止带声音的媒体自动播放。具体内容在这里chrome自动播放策略(可能国内网络访问不了)。此处重点是带声音的媒体自动播放。里面也说明了集中播放的方式 静音播放。只要将video设置为muted，然后就可以自动播放了。 引导用户点击后再进行播放。此处的点击是只要用户点击过页面的任
阅读全文
摘要：1.获取屏幕宽高 实现兼容 // 获取屏幕宽度let windowWidth = document.documentElement.clientWidth || document.body.clientWidth; // 获取屏幕高度let windowHeight = document.docum
阅读全文
摘要：最近做一个网页特效需要获取到div中实际的内容宽度（一个tab框的下滑块宽度需要对应实际内容宽度）有机会把这个案例整理下分享出来。但是HTML DOM 元素对象方法中却没有获取padding及实际内容宽度的方法。 解决方案我们可以通过WIndow对象提供的getComputedStyle() 获取指
阅读全文
摘要：获取元素位置可以用 offset 或 getBoundingClientRect，使用 offset 因为兼容性不好，比较麻烦，offset获取位置会形成“回溯”。而 getBoundingClientRect 方法则兼容性较好，基本所有的浏览器都支持了，且使用起来更容易和简单。 1.使用语法： e
阅读全文
摘要：<!DOCTYPE html> <html> <head> <script src="jquery-1.8.3.min.js"></script> </head> <body> <div id='labelText' style='color:black;line-height:1.2;white-
阅读全文
摘要：在使用canvas制作动画时，经常需要获取字符串的宽度与边缘进行对比，以下是通过js来获取任意字符串宽度的方法： function getTextWidth(text, fontSize) { // 创建临时元素 const _span = document.createElement('span'
阅读全文
摘要：//判断div里元素是否超出长度，true 超出，false 没有 dom=document.getElementById('id');function isEllipsis(dom) { var checkDom = dom.cloneNode(), parent, flag; checkDom.
阅读全文
摘要：方法： 做一个空的html 标签 id为“ruler”,样式为“position:absolute;visibility: hidden; white-space: nowrap;z-index: -100”; 目的为了不影响页面，只是用来放你要测的文字的宽度，得到目标文字的内容，大小和字体.放到如
阅读全文
摘要：判断页面加载完成这个方法是很常见的，下面有三个常用的方法，各有利弊。 一、纯js方法 // (1)、页面所有内容加载完成执行 window.onload = function(){ } // (2)、ie9以上版本监听事件 if('addEventListener' in document){ do
阅读全文
摘要：本文在github做了收录 github.com/Michael-lzg… 最近收到测试人员的反馈说我们开发的页面偶现卡死，点击无反应的情况，特别是打开页面较久的时候发生概率较高。打开任务管理器，看到内存占有率已经很高了，初步判断可能存在内存泄漏的情况。下面排查内存泄漏的原因。 系统进程不再用到的内
阅读全文
摘要：xpath选取a节点.png var a=document.evaluate("//a[@id='web-nav-app-download-btn']", document).iterateNext() 作者：l_meng链接：https://www.jianshu.com/p/3133137337
阅读全文
