Test IE browser compatibility with JavaScript's AngularJS

Home

Web Front-end

JS Tutorial

Test IE browser compatibility with JavaScript's AngularJS_AngularJS

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 03:53 PM

iejavascript

Short version

To ensure that Angular applications can work on IE please confirm:

1. Polyfill JSON.stringify on IE7 or earlier. You can use JSON2 or JSON3 for polyfills.

<!doctype html>
 <html xmlns:ng="http://angularjs.org">
  <head>
   <!--[if lte IE 7]>
    <script src="/path/to/json2.js"></script>
   <![endif]-->
  </head>
  <body>
   ...
  </body>
 </html>

2. Add id="ng-app" to the root element at the connection point and use the ng-app attribute

<!doctype html>
 <html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">
  ...
 </html>

3. You cannot use custom element tags like (use the attribute version

instead), or

4. If you must use custom element tags, then you must take the following steps to ensure that IE8 and earlier versions can be used:

<!doctype html>
 <html xmlns:ng="http://angularjs.org" id="ng-app" ng-app="optionalModuleName">
  <head>
   <!--[if lte IE 8]>
    <script>
     document.createElement('ng-include');
     document.createElement('ng-pluralize');
     document.createElement('ng-view');
 
     // Optionally these for CSS
     document.createElement('ng:include');
     document.createElement('ng:pluralize');
     document.createElement('ng:view');
    </script>
   <![endif]-->
  </head>
  <body>
   ...
  </body>
 </html>

5. Use ng-style tag instead of style="{{ someCss }}". Subsequent versions will work under Chrome and Firefox but not IE versions

The important part is:

xmlns:ng- namespace - You need to specify a namespace for each custom tag.
document.createElement(yourTagName) - Create a custom tag name - since this is only an issue with older versions of IE, you need to specify the loading conditions. For every tag that has no namespace and is not defined in HTML, you need to declare it in advance for IE to recognize it.

Version information

IE has a lot of problems with non-standard tag elements. These problems can be divided into two broad categories, each with its own solutions.

If the tag name starts with my: then it will be regarded as an XML namespace and must have a corresponding namespace declaration
If the tag does not have a : symbol but is not a standard HTML tag, it must be created in advance using document.createElement('my-tag').
If you plan to use CSS selectors to change the style of a custom tag, you must create it in advance using document.createElement('my-tag') regardless of whether it has a namespace or not.

Good news

The good news is that these restrictions only apply to element tag names and not to element attribute names. Therefore, no special processing is required in IE:

What will happen if I don't?

If you use HTML’s unknown tag mytag (the results of my:tag or my-tag are the same):

 
<html>
  <body>
   <mytag>some text</mytag>
  </body>
 </html>

should parse the following DOM:

#document
 +- HTML
   +- BODY
    +- mytag
      +- #text: some text

The expected behavior is that the BODY element has a mytag child element with some text.

But this is not the case in IE (if the above revision is not included)

#document
 +- HTML
   +- BODY
    +- mytag
    +- #text: some text
    +- /mytag

In IE, the BODY element has three child elements:

1, a self-closing mytag. For example, the self-closing tag
. / is optional, but the
tag is not allowed to have child elements. The browser treats
some text as three sibling tags, while some text is not
child elements.

2, a text node some text. In the above this should be a child element of mytag, not a sibling tag

3. A corrupted self-closing /mytag. This is a broken element because / characters are not allowed in element names. In addition, this sub-closed element is not part of the DOM, it is only used to describe the structure of the DOM.

CSS style custom tag naming

To ensure that CSS selectors can work on custom elements, the name of the custom element must be created in advance using document.createElement('my-tag'), regardless of the XML namespace.

<html xmlns:ng="needed for ng: namespace">
  <head>
   <!--[if lte IE 8]>
    <script>
     // 需要确认ng-include被正常解析
     document.createElement('ng-include');
 
     // 需求启用CSS引用
     document.createElement('ng:view');
    </script>
   <![endif]-->
   <style>
    ng\:view {
     display: block;
     border: 1px solid red;
    }
 
    ng-include {
     display: block;
     border: 1px solid blue;
    }
   </style>
  </head>
  <body>
   <ng:view></ng:view>
   <ng-include></ng-include>
   ...
  </body>
 </html>

Statement

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

es6数组怎么去掉重复并且重新排序May 05, 2022 pm 07:08 PM

去掉重复并排序的方法：1、使用“Array.from(new Set(arr))”或者“[…new Set(arr)]”语句，去掉数组中的重复元素，返回去重后的新数组；2、利用sort()对去重数组进行排序，语法“去重数组.sort()”。

Internet Explorer 打开 Edge：如何停止 MS Edge 重定向Apr 14, 2023 pm 06:13 PM

长期以来，InternetExplorer的失宠一直不是秘密，但随着Windows11的到来，现实开始了。Edge将来不再有时取代IE，它现在是微软最新操作系统中的默认浏览器。目前，您仍然可以在Windows11中启用InternetExplorer。但是，IE11（最新版本）已经有了一个正式的退役日期，即2022年6月15日，时间在流逝。考虑到这一点，您可能已经注意到InternetExplorer有时会打开Edge，而您可能不喜欢它。那么为什么会这样呢？在

win11无法使用ie11浏览器怎么办？(win11用不了ie浏览器)Feb 10, 2024 am 10:30 AM

越来越多的用户开始升级win11系统，由于每个用户的使用习惯不同，还是有不少用户在使用ie11浏览器，那么win11系统用不了ie浏览器，该怎么办呢？windows11还支持ie11吗？下面就来看看解决办法。win11无法使用ie11浏览器的解决方法1、首先右键开始菜单，选择“命令提示符（管理员）”打开。2、打开之后，直接输入“Netshwinsockreset”，回车确定。3、确定之后再输入“netshadvfirewallreset&rdqu

ie快捷方式无法删除如何解决Jan 29, 2024 pm 04:48 PM

ie快捷方式无法删除的解决办法：1、权限问题；2、快捷方式损坏；3、软件冲突；4、注册表问题；5、恶意软件；6、系统问题；7、重新安装IE；8、使用第三方工具；9、检查快捷方式的目标路径；10、考虑其他因素；11、咨询专业人士。详细介绍：1、权限问题，右键点击快捷方式，选择“属性”，在“安全”选项卡中，确保有足够的权限删除该快捷方式，如果没有，可以尝试以管理员身份运行等等。

Win10打开IE自动跳转到Edge怎么取消_IE浏览器页面自动跳转的解决办法Mar 20, 2024 pm 09:21 PM

近期不少的win10用户们在使用电脑浏览器的时候发现自己的ie浏览器总是自动的跳转到edge浏览器，那么win10打开ie自动跳转edge怎么关闭?。下面就让本站来为用户们来仔细的介绍一下win10打开ie自动跳转edge关闭方法吧。1、我们登录edge浏览器，点击右上角...，找下拉的设置选项。2、我们进入设置后，在左侧栏点击默认浏览器。3、最后我们在兼容性中，勾选不允许IE模式下重新加载网站，重启ie浏览器即可。

一个时代的结束：Internet Explorer 11 已退役，这是你需要知道的Apr 20, 2023 pm 06:52 PM

2022年6月15日是Microsoft结束对InternetExplorer11(IE11)的支持并关闭其旧版浏览器章节的日子。一段时间以来，该公司一直在提醒用户注意这一生命周期结束日期，并呼吁他们计划迁移到MicrosoftEdge。Microsoft将IE11与Windows8.1捆绑在一起，作为Windows的现代默认Web浏览器。尽管它从未达到Chrome的（当前）高度，但它是2014年使用量第二大的桌面浏览器，仅次于IE8。当然，随着20

JavaScript对象的构造函数和new操作符（实例详解）May 10, 2022 pm 06:16 PM

本篇文章给大家带来了关于JavaScript的相关知识，其中主要介绍了关于对象的构造函数和new操作符，构造函数是所有对象的成员方法中，最早被调用的那个，下面一起来看一下吧，希望对大家有帮助。

如何启用IE的加速功能Jan 30, 2024 am 08:48 AM

ie加速功能怎么开？ie打开网页的速度太慢，我们可以在里面开启硬件加速模式。很多小伙伴反应说在使用ie浏览器的时候，打开网页的速度特别的慢，这样对我们浏览网页也造成了一定影响。就想询问小编有什么解决办法，这种情况是可以开启ie浏览器的硬件加速模式，小编下面整理了ie开启加速功能方法，感兴趣的话一起往下看看！ie开启加速功能方法打开IE安全浏览器，点击右上角齿轮状的“设置”图标，选择“Internet选项”进入，如图所示。2、在Internet选项的窗口头部的标签导航中点击“高级”，如图所示。3、

See all articles