opera

3 月，跳不动了？>>> 作为号称下一代web应用模型的PWA，逐渐成为了一个各大前端厂商争先恐后进行涉足，布局的一个新的技术， 其主要的对标物Native app，作为现在最主流的mobile端应用，它的安全，性能，用户体验的确明显领先于其他互联网载体，但是原生App始终有一些缺点，比如 1. 昂贵开发成本 2. 软件上线，版本更新都需要发布到不同的商店，并通过审核 有些APP你可能使用频率特别少，但是你还是不得不去商店中下载庞大安装包，或者可能一段时间不使用以后，随着版本的更新，你也不得不去重新更新并安装 PWA技术的作为web应用，其天生优势能很好的解决以上的问题。 二. 什么是PWA PWA是Progressive Web App的英文缩写， 翻译过来就是渐进式增强WEB应用， 是Google 在2016年提出的概念，2017年落地的web技术。目的就是在移动端利用提供的标准化框架，在网页应用中实现和原生应用相近的用户体验的渐进式网页应用。 引用官方介绍： Reliable - Load instantly and never show the downasaur , even in uncertain network conditions . Fast - Respond quickly to user interactions with silky smooth

3 月，跳不动了？>>> 　　[PConline 杂谈]微软Edge 浏览器 换用Chromium内核已经不是新闻了，Chromium内核的Edge也已经正式发布，虽然没有通过Windows Update推送，但大家可以手动到Edge官网下载安装。很多人认为这是一件好事，毕竟Edge在过去几年不成气候，兼容性似乎不太令人满意，早换成主流的Chromium内核，对于用户体验是有好处的。 Edge已经换用了Chromium内核 　　Edge换用Chromium内核后，产品力的提升，是显而易见的。但这对于整个网络生态来说，真的是一件好事吗？Edge换用Chromium，乃至更早之前的Opera浏览器弃用自家内核、换用和Chrome一样的Blink，都有自己的苦衷。Chrome系浏览器已经形成垄断之势，Chrome面对竞争，耍过不少小手段，今天就一起来说说这方面的话题，大家应该对垄断心怀警惕。 Opera/Vivaldi：资深受害者 　　我们先从经典的Opera浏览器说起。如果你关注浏览器，应该知道Opera引领了很多浏览器的先进设计，例如快速拨号、标签页等等。 　　而Opera的原创内核Presto用户体验也很好，这个内核的渲染机制比较独特，会首先读取网页的框架，然后再文字、图片和其他元素逐渐在框架的相应位置显示。这样的好处就是，文字等可读性高的内容可以第一时间就呈献给用户

3 月，跳不动了？>>> 　　[PConline 杂谈]微软Edge 浏览器 换用Chromium内核已经不是新闻了，Chromium内核的Edge也已经正式发布，虽然没有通过Windows Update推送，但大家可以手动到Edge官网下载安装。很多人认为这是一件好事，毕竟Edge在过去几年不成气候，兼容性似乎不太令人满意，早换成主流的Chromium内核，对于用户体验是有好处的。 Edge已经换用了Chromium内核 　　Edge换用Chromium内核后，产品力的提升，是显而易见的。但这对于整个网络生态来说，真的是一件好事吗？Edge换用Chromium，乃至更早之前的Opera浏览器弃用自家内核、换用和Chrome一样的Blink，都有自己的苦衷。Chrome系浏览器已经形成垄断之势，Chrome面对竞争，耍过不少小手段，今天就一起来说说这方面的话题，大家应该对垄断心怀警惕。 Opera/Vivaldi：资深受害者 　　我们先从经典的Opera浏览器说起。如果你关注浏览器，应该知道Opera引领了很多浏览器的先进设计，例如快速拨号、标签页等等。 　　而Opera的原创内核Presto用户体验也很好，这个内核的渲染机制比较独特，会首先读取网页的框架，然后再文字、图片和其他元素逐渐在框架的相应位置显示。这样的好处就是，文字等可读性高的内容可以第一时间就呈献给用户

3 月，跳不动了？>>> 了解浏览器背后的运行机制 了解浏览器背后的运行机制就是了解浏览器的内核，现在市面上主流浏览器的内核名称分别如下： chrome: blink内核 Opera: blink内核 Safari: webkit内核 FireFox: Gecko内核 IE: Trident内核 ** 注：blink内核其实是基于webkit内核衍生出的一个新分支 ** 获取到的HTML/CSS/JS资源经过浏览器内核的处理生成图像呈现在浏览器上，那么下面我们就详细说说浏览器内核在拿到资源之后是经过哪些处理来生成我们最终所看到的页面。 浏览器内核主要的功能模块 浏览器在处理资源的过程中是由多个模块协同工作的，主要关注下面几个模块： HTML解析器：解析HTML文件，最终输出DOM树 CSS解析器：解析CSS文件，最终输出样式层叠表 图层布局计算模块：布局计算每个对象的大小和位置 视图绘制模块：将图层布局计算模块的结果形成像素并绘制到屏幕上 js模块：编译和执行js 浏览器渲染过程 解析HTML：执行所有的加载逻辑，在解析HTML的过程中发出渲染页面所需的所有请求。 计算样式：解析CSS文件，生成层叠样式表并于HTML结合生成渲染树(:before,:after这样的伪类是在该过程中生成的) 计算图层布局：精确计算所有DOM节点的大小以及在页面中的位置 绘制图层

我想抓住每个未定义的函数错误抛出。 JavaScript中是否存在全局错误处理工具？ 用例是捕获未定义的闪存函数调用。 #1楼 如何捕获未处理的Javascript错误 将 window.onerror 事件分配给事件处理程序，如： <script type="text/javascript"> window.onerror = function(msg, url, line, col, error) { // Note that col & error are new to the HTML 5 spec and may not be // supported in every browser. It worked for me in Chrome. var extra = !col ? '' : '\ncolumn: ' + col; extra += !error ? '' : '\nerror: ' + error; // You can view the information in an alert to see things working like this: alert("Error: " + msg + "\nurl: " + url + "\nline: " + line + extra); // TODO: Report this error via

在研究一个简单的HTMLElement包装器的想法时，我偶然发现了Internet Explorer和 Chrome 的以下内容： 对于DOM树中具有ID的给定HTMLElement，可以使用其ID作为变量名称来检索div。 所以对于像 <div id="example">some text</div> 在 Internet Explorer 8 和Chrome中，您可以执行以下操作： alert(example.innerHTML); //=> 'some text' 要么 alert(window['example'].innerHTML); //=> 'some text' 那么，这是否意味着 DOM树中的每个元素都将 转换为全局名称空间中的变量？ 并且这是否还意味着可以用它代替这些浏览器中的 getElementById 方法？ #1楼 如前面的答案中提到的，此行为称为 window对象上的命名访问 。 某些元素的 name 属性值和所有元素的 id 属性值都可以用作全局 window 对象的属性。 这些被称为命名元素。 由于 window 是浏览器中的全局对象，因此每个命名元素都可以作为全局变量进行访问。 它最初是由Internet Explorer添加的，最终由所有其他浏览器实现，只是为了与依赖此行为的网站兼容。 有趣的是，Gecko（Firefox的渲染引擎）选择仅以

什么是 localStorage HTML5加入了 localStorage ，作为客户本地存储文件，之前用cookie，但是每条cookie空间为4K localStorage 支持5M 一张图了解下客户端浏览器的存储发展史 浏览器支持情况 Feature Chrome Firefox Internet Explorer Opera Safari Android Opera Mobile Safari Mobile localStorage 4 3.5 8 10.50 4 2.1 11 iOS 3.2 sessionStorage 5 2 8 10.50 4 2.1 11 iOS 3.2 特点 1. 字符串存储：localStorage存储的值均为String 字符串 把对象转换成json字符串，就能让存储对象了；把图片转换成DataUrl（base64），就可以存储图片了。 月小升 试过音乐也可以转成字符串存。 2. 无法隐私：localStorage在浏览器的隐私模式下不可用 3. 爬虫情况：无法读取localStorage 4. 无法跨域： a.com 的localStorage 无法被b.com 直接读取 5. 过期时间：一直有效，客户不主动清空，那么数据一直在 判断localStorage if(!window.localStorage){ alert(

https://github.com/tomfriwel/weapp-qrcode qrcode = new QRCode( 'canvas_' + i, { text: qrCode, colorDark: "#000000" , colorLight: "#FFFFFF" , correctLevel: QRCode.CorrectLevel.H, width: 300 / 750 * wx.getSystemInfoSync().screenWidth, height: 300 / 750 * wx.getSystemInfoSync().screenWidth, }); 原因： 这里，你的颜色将会直接设置成strokeStyle 这个颜色是和html的canvas一样的 但是，浏览器内核对这个颜色的支持并不统一 唯一确定支持的颜色，是标准的# + 6位16进制数 我理解，可能vivo手机的浏览器内核是opera的 导致3位数字不能被支持 而且，有可能出现White！=white 这种，预定义名称的兼容性问题 全部化为标准的16进制6位写法 IE下，# + 8位16进制数的带透明度颜色，是不支持的 必须写成rgba(*,*,*,*) 有文章说过vivo的手机比较怪异，内核一些组件，默认浏览器内核，和大多数系统有点不同 如果内核真的是UC或者opera这种小众内核

<!DOCTYPE HTML> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>创建一个基本HTML5模板</title> <style type="text/css"> body { font-family: "Source Code Pro","Microsoft YaHei",微软雅黑; } </style> </head> <body> Hi,你好吗？ </body> </html> 该段代码在IE8、Chrome 22、Nightly 19中达到了英文字体使用 "Source Code Pro"，中文使用微软雅黑的目的。但是在Opera 12中却全部显示为微软雅黑。如下图： <!DOCTYPE HTML> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>创建一个基本HTML5模板</title> <style type="text/css"> @font-face { font-family: "SourceCodePro"; src: url("http://localhost:8888/music/assets/font/SourceCodePro/TTF/SourceCodePro-Regular.ttf") format(