ibm官方资料把应用程序从 Internet Explorer 迁移到 Mozilla

将应用程序从Internet Explorer迁移到Mozilla的完整攻略

1.概述

在本攻略中，我们将讨论将应用程序从Internet Explorer（IE）迁移到Mozilla Firefox的详细过程。本文中的步骤可能会涵盖IE和Firefox的各种版本，因此请您确保在操作前检查浏览器版本。以下是迁移的主要步骤：

• 调整HTML和CSS
• 更新Javascript代码
• 确保跨浏览器兼容性
• 过渡到Web标准
• 测试和调试

2. 调整HTML和CSS

• 将所有元素标记为小写字母，以符合XHTML规范。
• 遵循严格的HTML结构，包括head和body标签，以及正确的嵌套。
• 消除所有HTML中的错误和警告，并遵循W3C的标准。
• 使用外部CSS文件，并确保样式表完全兼容Firefox。
• 优化CSS代码，以确保在Firefox中渲染的速度更快。

3. 更新Javascript代码

• 将所有旧版Javascript代码更换为新版本，并确保其与Firefox兼容。
• 避免使用IE特定的方法和属性，例如document.all和attachEvent。
• 使用Firefox支持的方法和属性，例如addEventListener和document.getElementById。
• 验证Javascript代码是否符合W3C的标准，并消除错误和警告。

4. 确保跨浏览器兼容性

• 使用适当的Javascript库和框架，如jQuery和Prototype，以确保在所有浏览器中运行良好。
• 避免使用浏览器特定的API，并使用跨浏览器的解决方案代替。
• 确保所有页面在不同浏览器中都具有相同的布局和功能。

5. 过渡到Web标准

• 遵循Web标准，并使用语义化的HTML。
• 使用标准的CSS和Javascript，在所有浏览器中保持一致性。
• 遵循表单控件标准，为用户提供最佳的用户体验。

6. 测试和调试

• 在各种浏览器中测试应用程序，并确保在所有浏览器中运行良好。
• 使用Firefox的Web开发工具进行应用程序的调试。
• 在调试期间根据错误和警告更新代码，以确保应用程序的性能和稳定性。

示例说明

示例1

假设有一个JavaScript函数用于在IE中显示/隐藏元素：

function toggleElement(elementId){
   var element = document.all(elementId);
   if (element.style.display=='none')
        element.style.display='block';
   else
        element.style.display='none';
}

要在Firefox中使此函数运行，请使用以下代码来替换：

function toggleElement(elementId){
   var element = document.getElementById(elementId);
   if (element.style.display=='none')
        element.style.display='block';
   else
        element.style.display='none';
}

示例2

假设在IE中使用样式表对表格进行格式化：

<table style="border: 1px solid #000000;">
   <tr>
      <td style="background-color:#cccccc;">Name</td>
      <td style="background-color:#cccccc;">Age</td>
      <td style="background-color:#cccccc;">City</td>
   </tr>
   <tr>
      <td>John</td>
      <td>25</td>
      <td>New York</td>
   </tr>
   <tr>
      <td>Mary</td>
      <td>30</td>
      <td>London</td>
   </tr>
</table>

为了在Firefox中正确格式化这个表格，请使用以下代码替换：

<table class="styledTable">
   <tr>
      <td>Name</td>
      <td>Age</td>
      <td>City</td>
   </tr>
   <tr>
      <td>John</td>
      <td>25</td>
      <td>New York</td>
   </tr>
   <tr>
      <td>Mary</td>
      <td>30</td>
      <td>London</td>
   </tr>
</table>

并在样式表中添加以下规则：

.styledTable {
   border: 1px solid #000000;
}
.styledTable td {
   background-color: #cccccc;
}

这将为表格添加边框和背景色，使其在Firefox中正确呈现。