<html xmlns:ng="http://angularjs.org">
<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>

需要關(guān)注的是：

xmls:ng - 命名空間 - 對于每一個我們計劃使用的自定義標(biāo)簽，都需要有一個命名空間。

document.createElement(“自定義標(biāo)簽名稱”) - 自定義標(biāo)簽名稱的創(chuàng)建 - 因為這是舊版IE一個問題，我們需要通過IE判斷注釋（）來特殊處理。對于每一個沒有命名空間或者非HTML默認(rèn)標(biāo)簽，都需要進行這種預(yù)定義，以讓IE不會犯傻（例如沒樣式…）。

三、Long Version（詳情）

　　IE對于非標(biāo)準(zhǔn)HTML標(biāo)簽的處理會有問題。這大致可以氛圍兩類（有、無命名空間），每一類都有他自己的一個解決方式。

如果標(biāo)簽名稱以”my:”開頭的話，將被當(dāng)作命名空間，必須要一個想對應(yīng)的命名空間定義（<html xmlns:my=”ignored”>）。

如果標(biāo)簽沒有命名空間（xx:開頭），但并非一個標(biāo)準(zhǔn)的HTML的話，需要通過document.createElement(“標(biāo)簽名稱”)進行聲明。

如果我們打算對自定義標(biāo)簽定義樣式的話，我們必須使用document.createElement(“標(biāo)簽名稱”)來進行自定義，regardless of XML命名空間（實驗證明，regardless of XML namespace意思很有可能是：不用管有命名空間的自定義標(biāo)簽）。

四、The Good News（好消息）

　　好消息是，這個限制僅僅是對于元素名稱的，對屬性名稱沒影響。所以不需要對自定義屬性（<div> my-tag your:tag></div>）做特殊處理。

五、What happens if I fail to do this？（沒做這些處理的話，會發(fā)生什么事呢？！）

　　假設(shè)我們有一個非標(biāo)準(zhǔn)的HTML標(biāo)簽（對于my:tag或者my-tag都有一樣的結(jié)果。但測試過后，發(fā)現(xiàn)命名空間方式不會有這種煩惱）。

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

　　　　一般來說，將會轉(zhuǎn)換為一下的DOM結(jié)構(gòu)：

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

　　我們期望的，是BODY元素有一個mytag子元素，mytag又有一個文本子元素”some text”。

　　但IE不是這么干的（如果做了糾正措施，則不包括在內(nèi)）！

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

　　在IE里面，BODY將會有3個孩子元素：

　　1. 一個自閉合的” mytag”，與<br/>類似。末尾的“/”是可選的，但<br>標(biāo)簽不允許有任何子元素，所以瀏覽器將其分為<br>、some text、</br>三個兄弟元素，而不是單獨的<br>元素中含有some text元素。

　　2. 一個文本節(jié)點“some text”。這本來應(yīng)該是mytag元素的子節(jié)點，不是它的兄弟節(jié)點。

　　3. 一個錯誤的自閉合標(biāo)簽” /mytag”，說它錯誤，是因為元素名稱不允許含有”/”字符（在最后應(yīng)該是允許的<br/>）。此外，閉合元素不應(yīng)該是DOM的一部分（不應(yīng)該以元素形式出現(xiàn)），因為它只用作勾畫DOM結(jié)構(gòu)的邊界。

六、CSS Styling of Custom Tag Names（對自定義標(biāo)簽進行CSS樣式定義）

　　如果想讓CSS選擇器對自定義元素有效，那么自定義元素必須通過document.createElement(“元素名稱”)進行預(yù)定義，regardless of XML namespace（實驗證明，這里是不用管有XML命名空間的？?。?/p>

　　這里是自定義標(biāo)簽樣式定義的例子：

<!DOCTYPE html>
<html xmlns:ng="needed for ng: namespace">
<head>
  <title>IE Compatbility</title>
  <!--[if lte IE 8]>
  <script>
    // needed to make ng-include parse properly
    document.createElement('ng-include');

    // needed to enable CSS reference
    document.createElement('ng:view');//注釋掉也可以？！
  </script>
  <![endif]-->
  <style>
    ng\:view {
      display: block;
      border: 1px solid red;
      width:100px;
      height:100px;
    }

    ng-include {
      display: block;
      border: 1px solid blue;
      width:100px;
      height:100px;
    }
  </style>
</head>
<body>
  <ng:view></ng:view>
  <ng-include></ng-include>
</body>
</html>

您可能感興趣的文章: