随笔分类 - 网页/JS/CSS/前端
1
摘要：此文仅供自己快速查询常用的特性。 Feature iOS Safari Android Chrome Firefox 箭头函数 10 45 45 22 let 10 49 41(strict模式),49 44 const 5 25 21 36 for...of 7 38 38 13 ...展开 8
阅读全文
摘要：Web Site Project （WSP）项目 升迁到Web Application Project（WAP）项目 指南
阅读全文
摘要：VUE3使用原生html方式书写组件
阅读全文
摘要：有很多时候，我们不需要编译Vue和Element UI，只是想简单的试用一下，做一个原型出来。我们会使用HTML方式编写，这种方式下，使用ICON需要注意一些问题。 1.例如CopyDocument图标，如果是用html tag方式调用，根据vue的组件规范，驼峰格式需要改写成小写横线分割的格式<c
阅读全文
摘要：判断网页中的Element元素是否可见，在Google上搜索得到3中方法： var d = document.getElementById('someId'); 1. d.checkVisibility(); 此方法目前只有 谷歌 105 版本 和 Firefox 106版本 以后的浏览器支持，Sa
阅读全文
摘要：1.FCP时间太久。首屏不应该包含动态内容，内容在动，可能会被认作没有完成FCP的渲染。 2.关于CLS。CSS不应该包含在页面中间，如果页面中间有CSS，建议移动到页面头部Head里面。 3.LCP。尽可能的缩减图片的大小，提高压缩比，降低图片质量，加载越快LCP分数越高。
阅读全文
摘要：DevTools，浏览器开发员工具可以仿真手机，如何能检测出来是手机还是电脑？通过WebGL的vendor和renderer信息可以获得显卡相关的信息，然后分辨是运行在什么环境
阅读全文
摘要：使用： performance.getEntries()[0].type 返回的值有4种： enum NavigationTimingType { "navigate", "reload", "back_forward", "prerender" }; navigate 通过网址导航过来 reloa
阅读全文
摘要：cdn资源加载失败后，保底加载本地资源
阅读全文
摘要：用新的 Proxy 具体见：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Proxy
阅读全文
摘要：iView组件好用，文档齐全，品质可靠稳定。最大的好处是使用了Vue框架，使很多数据绑定和交互问题变的轻松，是难得的开源前端组件。给作者点个赞。用这个组件来学习Vue.js也是不错的选择。 最近用的比较多。碰到的主要问题是绑定事件，试了很多种写法，可能是对vue不太了解，一直没试对。最终发现写法其实
阅读全文
摘要：在符合W3C标准的浏览器里，可以使用addEventListener方法来添加事件。 当不需要为一个事件添加多个处理函数的时候，可以简单的使用onXXX=function(){}的方式来添加事件处理函数，但是当需要为同一事件添加多次处理函数（handler）时，就要用到addEventListene
阅读全文
摘要：在Chrome 55下测试，可用。 1.箭头函数(arrow function) 以前写的匿名函数是这样的 function(){}， 现在可以简单写成这样()=>{} 如果直接return，没有复杂的过程，甚至可以写成 x=>x+1，实际上相当于 function (x){ return x+1
阅读全文
摘要：ECMAScript 6新增了箭头函数 原来的匿名函数 function(){}，现在可以简化成()=>{} 看起来高大上，像C#什么的语法。 但是箭头函数的this对象，不能更改，总是指向函数定义生效时所在的对象。 如果用在jQuery的事件处理，就会导致this指向意想不到的元素，比如全局的wi
阅读全文
摘要：vue.js渲染完成事件--mounted
阅读全文
摘要：<input type='checkbox' />可以半选中，这个特性，很多浏览器都支持，包括Firefox，Chrome和IE 用 input.indeterminate 这个属性来获取或者设置半选中状态。 input.indeterminate = true; //设置成半选中 if(input
阅读全文
摘要：Firefox刷新页面后数据还在，估计很多人都碰到过。 但是有一个奇怪的地方就是复选框，如果你默认是勾选了，然后访问者取消勾选，刷新完之后，还是没有勾选，这是为什么？ Firefox奇葩的地方就在于checked属性，一个input如果有checked属性，那在Firefox下默认是勾选的，但是刷新
阅读全文
摘要：1.rem 相对根元素字体的大小 2.vw,vh(视口宽度，视口高度) 相对于viewport的长度 3.calc 可以通过计算表达式，得出大小 例如：width:calc(100% - 10px); 注意，这里的 100% 和 减号 和 10px 三者之间，必须有空格，否则会出错。
阅读全文
摘要：使用jQuery操作HTML中不存在的元素（自定义的标签）出现的问题解决办法
阅读全文
摘要：网上找了WebSocket几个版本的实现有C#的，Netty的，NodeJS的实现，但都是旧版本(Draft76)的实现，在更新到最新版本的Chrome（16 stable）之后，就无法连接了。 于是在网上找了一些资料和代码拼凑成了最新版本协议的实现。 新版本WebSocket的安全验证方式发生了变
阅读全文
1
