最近使用阿里低代码体系开发了H5 相关表单提交的业务，毫无悬念的会遇到兼容性问题，通常我们所理解的兼容性问题无非两种， CSS 样式显示错乱 或者JS 相关报错出现页面白屏，为了解决这样的问题，本质上是对浏览器兼容性适配
首先我们可以 通过以下方法查看浏览器的版本
window.navigator.userAgent
通常有些童鞋开始对于这类问题不会查看浏览器版本，导致对于问题产生原因不是很清楚，所以建议查看浏览器版本，然后通过查看 对应的官方地址查看对应的适配性:
演示一下，我们可以查看展开运算符 ... 支持浏览器版本
caniuse
然后我们可以直接点击 MDN Web Docs 直接打开 MDN 的地址
MDN
我们会很清楚看到兼容性问题，剩下的就是解决问题了， 通常对于JS 的兼容问题， 常用是 babel 用作语法转化, 通常我们项目脚手架已经配置好了对应的配置，通常
我们可以利用 npx browserslist 查看对应的支持浏览器版本
and_chr 103
and_ff 101
and_qq 10.4
and_uc 12.12
android 103
chrome 104
chrome 103
chrome 102
edge 103
edge 102
firefox 103
firefox 102
ios_saf 15.5
ios_saf 15.4
ios_saf 14.5-14.8
kaios 2.5
op_mini all
op_mob 64
opera 89
opera 88
safari 15.6
safari 15.5
samsung 17.0
samsung 16.0
我们也可以通过 设置来设置支持浏览器的版本
> 1%
last 2 versions
not dead
Chrome > 55
对于CSS 样式的兼容，如果利用第三方组件库，可以参照对应库的支持方案，例如 ant-design-mobile , 文档中有对应的版本支持方案，
https://mobile.ant.design/zh/guide/css-variables#css-%E5%8F%98%E9%87%8F%E8%87%AA%E5%8A%A8%E9%99%8D%E7%BA%A7
所以解决思路很清晰，大家根据需要可以参考。
