网页上所用到的语言有:html, css, JavaScript等,其中,前两者通常决定了该页面长什么样,它们是可以说都是约定的规范。不同的浏览器在获取到某页面的代码文件后,负责根据这套规范将代码渲染出来呈现给用户,浏览器内核所做的就是这个渲染工作。因此,浏览器内核,也被称为排版引擎(layout engine)、渲染引擎(rendering engine)。
浏览器内核对于浏览器而言,是基础,是依托。如果没有了浏览器内核,那么浏览器是无法独立存在且产生作用的。它的存在,决定了网页的呈现的内容、格式以及效果。所以说,一个好的浏览器,一定是基于有一个稳定、高端、作用明显的浏览器内核的。
(1)TRIDENT内核
该内核程序在1997年的IE4中首次被采用,是微软在Mosaic代码的基础之上修改而来的,并沿用到IE11,也被普遍称作”IE内核”。Trident实际上是一款开放的内核,其接口内核设计的相当成熟,因此才有许多采用IE内核而非IE的浏览器(壳浏览器)涌现。由于IE本身的“垄断性”(虽然名义上IE并非垄断,但实际上,特别是从Windows 95年代一直到XP初期,就市场占有率来说IE的确借助Windows的东风处于“垄断”的地位)而使得Trident内核的长期一家独大。
微软很长时间都并没有更新Trident内核,这也导致了后面的两个后果: 一是Trident内核曾经几乎与W3C标准脱节(2005年) 二是Trident内核的大量 Bug等安全性问题没有得到及时解决,然后加上一些致力于开源的开发者和一些学者们公开自己认为IE浏览器不安全的观点,也有很多用户转向了其他浏览 器,Firefox和Opera就是这个时候兴起的。Trident内核的常见浏览器有:IIE6、IE7、IE8(Trident 4.0)、IE9(Trident 5.0)、IE10(Trident 6.0);以及国产浏览器中的兼容模式。
(2)GECKO内核
Netscape6开始采用的内核,后来的Mozilla FireFox(火狐浏览器) 也采用了该内核,Gecko的特点是代码完全公开,因此,其可开发程度很高,全世界的程序员都可以为其编写代码,增加功能。因为这是个开源内核,因此受到许多人的青睐,Gecko 内核的浏览器仍然还是Firefox (火狐) 用户最多,所以有时也会被称为Firefox内核。Gecko核心设计的相对成熟,在无法获取源码的情况下,开放程度仅次于IE。
(3)WEBKIT内核
Webkit:是苹果公司自主研发的内核,也是Safari浏览器使用的内核。 Webkit引擎包含渲染引擎WebCore和javascript引擎JSCore,均是从KDE的KHTML及KJS引擎衍生而来,它们都是自由软件,在GPL条约下授权,同时支持BSD系统的开发。所以Webkit也是自由软件,同时开放源代码。Google Chrome、Opera及各种国产浏览器高速模式也使用Webkit作为内核。
(4)BLINK内核
Blink是一个由Google和Opera Software开发的浏览器排版引擎,Google计划将这个渲染引擎作为Chromium计划的一部分,并且在2013年4月的时候公布了这一消息。这一渲染引擎是开源引擎WebKit中WebCore组件的一个分支,并且在Chrome(28及往后版本)、Opera(15及往后版本)中使用。
一些浏览器他们的内核:
谷歌浏览器:Google Chrome。
谷歌浏览器:Google Chrome,谷歌浏览器之前一直使用苹果的webkit内核,但是现在它与苹果内核分道扬镳,自己开创了新的blink内核,这个内核也在被欧鹏(opera浏览器)共同采用和开发;
火狐浏览器:Mozilla Firefox ,内核是Gecko;
opera浏览器:内核是blink;
Safari浏览器:使用的是苹果公司自己的内核:webkit。
IE浏览器是微软出品的浏览器,IE4以上版本都是Trident内核。由于垄断性,IE在很长一段时间内没有更新,导致两个后果:一是IE与W3C标准脱节,二是Trident内核大量的bug问题没得到及时解决。所以这就给了其他浏览器机会,比如firefox等。也正是这些原因,使Web前端开发人员大费折,特别是IE6正处在新旧交替的关键地方(已经逐渐被舍弃).
搜狗浏览器:兼容模式(IE:Trident)和高速模式(webkit)
傲游浏览器:兼容模式(IE:Trident)和高速模式(webkit)
QQ浏览器:普通模式(IE:Trident)和极速模式(webkit)
360极速浏览器:基于谷歌(Chromium)和IE内核
360安全浏览器:IE内核
function getBrowserInfo(){
var ua = navigator.userAgent.toLocaleLowerCase();
var browserType=null;
if (ua.match(/msie/) != null || ua.match(/trident/) != null) {
browserType = "IE";
browserVersion = ua.match(/msie ([\d.]+)/) != null ? ua.match(/msie ([\d.]+)/)[1] : ua.match(/rv:([\d.]+)/)[1];
} else if (ua.match(/firefox/) != null) {
browserType = "火狐";
}else if (ua.match(/ubrowser/) != null) {
browserType = "UC";
}else if (ua.match(/opera/) != null) {
browserType = "欧朋";
} else if (ua.match(/bidubrowser/) != null) {
browserType = "百度";
}else if (ua.match(/metasr/) != null) {
browserType = "搜狗";
}else if (ua.match(/tencenttraveler/) != null || ua.match(/qqbrowse/) != null) {
browserType = "QQ";
}else if (ua.match(/maxthon/) != null) {
browserType = "遨游";
}else if (ua.match(/chrome/) != null) {
var is360 = _mime("type", "application/vnd.chromium.remoting-viewer");
function _mime(option, value) {
var mimeTypes = navigator.mimeTypes;
for (var mt in mimeTypes) {
if (mimeTypes[mt][option] == value) {
return true;
}
}
return false;
}
if(is360){
browserType = '360';
}else{
$('html').css("zoom",".80");
}
}else if (ua.match(/safari/) != null) {
browserType = "Safari";
}
}
只有原生Chrome中存在一种MimeType“application/vnd.chromium.remoting-viewer”,由此可以判断浏览器是加壳Chrome或是原生Chrome。 再如,只有IE内核的浏览器存在ActiveXObject对象。由此可以判断是否为IE浏览器
判断浏览器类型,我们需要遵循以下原则:
1、采取命中特征原则,当且仅当完全符合区分浏览器的特征时我们才会采用此特征。例如单纯通过UA中MSIE来检测是否为IE浏览器是不可靠的。而通过判断是否存在MimeType“application/vnd.chromium.remoting-viewer”来断言原生Chrome在现阶段来看是可行性,但也不保证永久有效。
2、对于主流浏览器来说一般不存在UserAgent关键字冲突,但对于许多加壳浏览器者就不一定了。再次提出某数字浏览器,userAgent干脆和IE一模一样,但渲染模式等等不不知道动了什么手脚,与标准IE行为差异很大。通过userAgent来判断浏览器时,优先命中浏览器特征字。匹配则基本确定为该浏览器,但未匹配也并不代表不是此浏览器。请悉知。
3、优先使用浏览器特性来区分浏览器,因为这个准确性较高。其次再采用userAgent辅助判断,从而达到最高的匹配度。
4、优先检测第三方加壳浏览器,目前并未有十分好的方案,只能枚举大部分世面上存在并可以判断的浏览器,其他未匹配任何规则的浏览器,为了兼容,请将规则落到四大浏览器之一。
5、判断浏览器版本,仅仅是为了针对特定浏览器进行优化,需要有特定的业务场景需要才要这么做。或者当某个浏览器出现兼容问题时,紧急添加针对浏览器的补丁代码时才判断。更加科学稳妥的办法是使用标准的JS函数和api,页面元素和样式设计遵循W3C标准。可能存在争议的兼容性问题尽可能采用第三方框架如jquery。这才是解决兼容性问题的根本。
下面附上最近整理规纳判断浏览器类型的代码
您的浏览器禁用了JS脚本运行,请启用该功能。怎么解除浏览器禁用js?这篇文章将总结整理各个浏览器如何开启、禁用javascript的方法总汇。
浏览器使用流式布局模型 (Flow Based Layout)。浏览器会把HTML解析成DOM,把CSS解析成CSSOM,DOM和CSSOM合并就产生了Render Tree。有了RenderTree,我们就知道了所有节点的样式,然后计算他们在页面上的大小和位置,最后把节点绘制到页面上。
IE6不支持min-height,解决办法使用css hack,ol内li的序号全为1,不递增。解决方法:为li设置样式display: list-item;定位父元素overflow: auto;,包含position: relative;子元素,子元素高于父元素时会溢出。解决办法:
由于不同的浏览器默认的样式也不同,所以在网页开发前设置一个公用样式,来清除各个浏览器的默认样式,已达到做的网页在各个浏览器中达到统一。
浏览器访问网站的步骤:Chrome搜索自身的DNS缓存、读取本地HOST文件、浏览器发起一个DNS的一个系统调用、浏览器获得域名对应的IP地址后,发起HTTP三次握手、TCP/IP连接建立起来、服务器端接受到了这个请求、浏览器根据拿到的资源对页面进行渲染
Browsh是一个纯文本浏览器,可以运行在大多数的TTY终端环境和任何浏览器。目前,终端客户端比浏览器客户端更先进。终端客户端即时更新和交付,以便于体验新的功能,例如,你可以观看视频。
一般说的浏览器内核是指浏览器最重要的核心部分,RenderingEngine,翻译成中文大概意思就是“解释引擎”,我们一般称为浏览器内核。由于不同的内核各自有一套自己的渲染网页和解释页面代码的机制,所以就会有一些问题存在。
主流浏览器之争从上个世纪开就开始,已经持续了很长的时间。人们都在笑话IE,纷纷转向其它浏览器。今天,我向大家分享一下针对IE的搞笑图片,只是逗乐而已,喝杯咖啡,坐下来慢慢享受吧。
有时候我们希望在浏览器中执行一些低优先级的任务,比如记录统计数据、做一些耗时的数据处理等,暂且将其称为后台任务。这些任务跟动画计算、合成帧、响应用户输入等高优先级的任务共享主线程
浏览器的事件循环,前端再熟悉不过了,每天都会接触的东西。但我以前一直都是死记硬背:事件任务队列分为macrotask和microtask,浏览器先从macrotask取出一个任务执行,再执行microtask内的所有任务,接着又去macrotask取出一个任务执行
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!