angular - 与 React/Angular 的跨浏览器兼容性

Question

由于我是 Web 开发的新手，我想要求澄清以下问题：

1）避免跨浏览器问题的最佳做法是什么（我发现了很多关于此的不同信息）。我需要清晰、简单的“食谱”——我应该首先做什么，接下来做什么。

2）与第 1 点相关，当我们想要保持跨浏览器兼容性并从我们的项目中摆脱 JQuery 时，我们应该怎么做？

3) 如果我们有 React/Angular 和预处理器 (SASS) 和 Flexbox/Bootstrap 等框架可供我们使用，我们还可以或应该做些什么来创建具有跨浏览器兼容性的专业网站？

标签： angularreactjscsscross-browser

Answer 1

我可以从 Angular 的角度说话

1.) 我不会说有一个独特的配方，因为在你开发时需要记住一些指导方针。需要注意的最重要的事情之一是代码中直接引用 DOM 的任何内容。通常不鼓励直接引用 DOM，因为当您引用 DOM 中的元素时，不同的浏览器会返回不同的对象。如果您使用的是 Angular，请确保使用"@angular/platform-browser": "<ANGULAR_VERSION>", "@angular/platform-browser-dynamic": "<ANGULAR_VERSION>"，并且一如既往地确保这些依赖项的版本与您的其余依赖项的版本相匹配@angular。Angular Polyfills也值得研究，因为它们可以帮助您支持一些比其他浏览器更复杂的浏览器。永远记住要经常在不同的浏览器上测试你的代码。

2.) 这真的取决于你如何使用 jquery。有很多方法可以将 jquery 替换为 Angular 的某些部分，例如*ngFor或*ngIf. Angular 组件的模板非常灵活，您可以通过使用 Angular 函数和使用引用变量的插值来动态更新页面，您可以使用组件中的函数动态更新这些变量。

3.）如果您使用的是 NPM，我会考虑使用scss-bundle依赖项。如果您也在使用 webpack，您还应该能够轻松地从 bootstrap 等框架导入样式，即@import "~bootstrap/scss/bootstrap";. 您需要做的就是确保在 NPM 中安装了引导依赖项。一般来说，框架在生成样式时已经考虑了跨浏览器支持（以及其他方面，例如可访问性和响应性）。