随笔分类 -  浏览器差异与bug

autoprefixer插件的使用踩坑
摘要：这个插件主要配合打包自动添加css浏览器兼容前缀，比如-webkit-、-ms-等。官网：https://github.com/postcss/autoprefixer 这是PostCSS的插件，根据官网，配置参数有两种方式 引用的时候作为参数传递 在.browserslistrc文件或者packa 阅读全文
posted @ 2020-05-27 15:21 chua1989 阅读(2319) 评论(0) 推荐(0)
移动端点击问题
摘要：IOS safari 点击失效详解 出现情况： 使用 zepto 或 jQuery 的情况下，给一个元素添加click事件，如果事件是委托到 document 或 body 上，并且委托的元素是默认不可点击的（如 div, span 等），此时 click 事件在IOS safari中会失效。 案例 阅读全文
posted @ 2020-02-06 10:36 chua1989 阅读(456) 评论(0) 推荐(0)
浏览器加载和渲染HTML的过程（标准定义的过程以及现代浏览器的优化）
摘要：先看一下标准定义的浏览器渲染过程（网上找的）： 浏览器打开网页的过程 用户第一次访问网址，浏览器向服务器发出请求，服务器返回html文件； 浏览器开始载入html代码，发现 head 标签内有一个 link 标签引用外部CSS或JS文件； 浏览器又发出CSS及JS文件的请求，服务器返回这个CSS，J 阅读全文
posted @ 2016-08-22 18:26 chua1989 阅读(2006) 评论(0) 推荐(2)
IE兼容性问题汇总【持续更新中】
摘要：问题：IE8/9不支持Array.indexOf 解决方案 if (!Array.prototype.indexOf) { Array.prototype.indexOf = function(elt /*, from*/) { var len = this.length >>> 0; var fr 阅读全文
posted @ 2016-02-26 14:21 chua1989 阅读(8806) 评论(0) 推荐(9)
placeholder的兼容处理(jQuery下)
摘要：这是一个老问题，结合前辈们的经验，需要处理的问题有一下几个。 1.只有输入框（input/textarea）下的palaceholder属性存在的时候才需要处理这类兼容 2.处理好输入框上焦点和是焦点的文本显示 3.密码输入框比较特殊，因为为其设置显示文本时显示的是一串“***”。这个问题后面分析。 阅读全文
posted @ 2015-12-21 10:27 chua1989 阅读(2223) 评论(0) 推荐(0)
IE9父容器overflow:auto时，子容器状态更改导致滚动条下出现额外空间的问题探讨
摘要：IE的每次跟新都会有一些奇葩的bug，我们默默承受了。 这个问题在项目中出现困扰了我近一个星期，这里记录一下。看下面实例 <style> .panel{ width: 200px; overflow: auto; background-color: #f00; } .inner{ width: 25 阅读全文
posted @ 2015-12-15 10:43 chua1989 阅读(2137) 评论(0) 推荐(2)
window、document、html、body、element的事件属性比较
摘要：在分析jQuery的事件的时候有提到绑定事件的方式： Dean Edwards的跨浏览器事件绑定使用的方式是 element["on" + type] = handleEvent; 即绑定的事件的前提条件是element.onxxx属性必须存在。 jQuery的绑定方式是使用浏览器的绑定绑定方法 i 阅读全文
posted @ 2015-12-10 17:43 chua1989 阅读(3293) 评论(1) 推荐(3)
报告一个IE很奇葩的滚动条问题——百分比计算宽度为浮点数时的滚动条显示异常
摘要：起因： 做项目的时候做了一个表格内容超过DIV容器自动横向滚动处理。别的浏览器都正常；但是在IE下面明明表格table和容器DIV宽度一致但是却出现了滚动条。如图 然后本人做实验找了半天原因终于是找到了，是IE浏览器使用百分比计算宽度值不是整数值引起的。 实例1：使用百分比计算结果是整数的情况下显示 阅读全文
posted @ 2015-12-09 16:34 chua1989 阅读(4011) 评论(0) 推荐(2)
html/css基础篇——关于浏览器window、document、html、body高度的探究
摘要：首先说明本人所理解的这几个元素的计算 window高度应当是文档所在窗口的可视高度（没有包括浏览器的滚动条），计算方法document.documentElement.clientHeight document高度应该为文档内容的高度，计算方法Math.max(document.body[ "scr 阅读全文
posted @ 2015-11-26 17:56 chua1989 阅读(8102) 评论(0) 推荐(6)
jQuery-1.9.1源码分析系列（七） 钩子（hooks）机制及浏览器兼容
摘要：处理浏览器兼容问题实际上不是jQuery的精髓，毕竟让技术员想方设法取弥补浏览器的过错从而使得代码乱七八糟不是个好事。一些特殊情况的处理，完全实在浪费浏览器的性能；突兀的兼容解决使得的代码看起来既不美观也也不能对前端技术有任何提升。但是不管怎么说，只要不同的浏览器存在，就有可能出现兼容性问题，我们还 阅读全文
posted @ 2015-11-16 11:23 chua1989 阅读(3142) 评论(1) 推荐(3)