打开任何一个网页，浏览浏览器都在替你做一件事：把服务器发来的器内HTML、CSS和JavaScript翻译成你能看见、核检能点击的浏览页面。干这个活的器内核心部件，就是核检浏览器内核，也叫渲染引擎。浏览你写的器内代码在Chrome里跑得好好的，到了Safari上可能就错位了——问题多半出在内核差异上。核检

目前市面上活跃的浏览内核主要有四种。Blink，器内Chrome和Edge在用，核检 Opera也跟了，浏览国内一大票套壳浏览器比如360、器内QQ浏览器、核检UC，底层同样是Blink。WebKit，Safari的专属，macOS和iOS上所有浏览器都被苹果强制要求使用WebKit，Chrome在iPhone上也不例外。Gecko，Firefox独苗，Mozilla这些年一直在维护它。还有Trident，也就是IE那套，微软自己在2022年6月彻底停止了IE的支持，但国内不少政企系统、银行网银还在靠IE模式苟着，Edge里内置了IE兼容模式来兜底。

为什么这事儿值得单独拿出来说？因为内核决定了你的网页能用什么API、支持哪些CSS属性、JavaScript跑出来是什么效果。举个具体的例子：-webkit-backdrop-filter这个属性，在Safari上写backdrop-filter就行，但在某些版本的Chrome里必须加-webkit-前缀才生效。再比如gap属性用在Flexbox布局里，Safari 14.1之前根本不认，你得用margin去模拟间距。这些细节不检测内核，根本没法做针对性处理。

检测内核的方法有好几种，最直接的是读navigator.userAgent。这串字符串里包含了浏览器标识、版本号、操作系统信息。比如Chrome的UA里会有AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36，看到Chrome/基本就能确定是Blink系。但UA可以伪造，而且越来越长、越来越混乱。Edge的UA里同时出现Chrome和Edg，搞得很多老代码判断出错。

更靠谱的方式是特性检测。不关心你是什么浏览器，只关心你支不支持某个功能。比如判断是否支持WebP格式，可以创建一个Image对象，设置src为一张WebP图片的data URI，看onload和onerror哪个先触发。这种做法绕开了UA的坑，直接问浏览器“你能不能干这个活”。Modernizr这个库就是干这个的，虽然现在用得少了，但思路一直有效。

还有一种偏门但实用的方法：CSS hack。不同内核对某些CSS解析规则的处理不一致，可以利用这一点写只在特定内核生效的样式。比如@supports (-webkit-appearance:none)可以筛出WebKit和Blink系浏览器。不过这种方法维护成本高，不到万不得已不建议用。

实际开发中，我一般会组合使用。先看UA做粗筛，再用特性检测做精判。比如要判断是不是Safari，光看UA里有Safari不够，因为Chrome的UA里也有。得同时满足包含Safari、不包含Chrome、不包含Chromium、不包含Android这几个条件。这种判断逻辑写起来啰嗦，但确实管用。

移动端的情况更复杂。微信内置浏览器在iOS上是WebKit，在Android上是Blink（基于X5内核，X5又是Blink的魔改版）。抖音、小红书这些App的内置浏览器也各有各的定制。你没法穷举所有UA，只能抓住核心特征做判断。

说到底，内核检测不是为了炫技，是为了让页面在目标用户的实际环境里正常工作。与其花时间适配所有可能的浏览器，不如先搞清楚你的用户到底在用什么东西打开你的页面。数据比猜测可靠得多。