Firefox for Android在執行JavaScript之前是否無法加載頁面？

Question

我想使用document.documentElement來獲取已加載網頁的clientWidth和clientHeight 。 我還想使用<meta name="viewport" content="width=device-width"/>保持我的視口在移動設備上縮放。 這種方法適用於Android Chrome，Opera和Dolphin瀏覽器，但不適用於Firefox。 在頁面完全加載之前，Firefox似乎正在執行我的JavaScript。 meta標簽無效， document.documentElement.clientWidth返回980，我確定這是默認值。

我在網上看到的駭客行為是在執行任何JavaScript之前添加時間延遲，這對我來說是一個糟糕的解決方案。 如果我放置一個alert("");該頁面也可以正確呈現alert(""); 在我的代碼中，但這與時間延遲是一樣的事情，而變通辦法則更荒謬。

另外，頁面在第一次加載和刷新頁面后呈現的外觀不同（盡管在兩種情況下仍然不正確）。 我確定Firefox會像滾動位置一樣緩存某些內容，但是請告訴我，有一種方法可以讓我的頁面在沒有這些愚蠢的hack的情況下首次在Android Firefox中正確加載。

這是一些示例HTML：

<html>
    <head>
        <meta name="viewport" content="width=device-width"/>
        <script src="file_with_initialize_function_in_it.js" type="text/javascript"></script>
        <title>How to bake a cake with goat milk</title>
    </head>
    <body>
        <script type="text/javascript">
            // alert("I don't like goat cake.");
            // The page works fine if I uncomment the above line.
            initialize();
        </script>
    </body>
</html>

這是file_with_initialize_function_in_it.js：

function initialize(){
    var output=document.createElement("p");
    output.id="output";// There is a css file that defines color for output
    output.style.top=document.documentElement.clientHeight*0.5+"px";
    document.body.appendChild(output);
}

我注意到在創建輸出時meta標簽可以正常工作

元素本身而不是使用JS來創建並動態附加。

Answer 1

通過不向DOM動態添加元素，我能夠解決meta標記的問題。 我仍然可以動態地操縱這些元素的style屬性，但是將它們放到html中而不是使用document.body.appendChild()似乎允許meta標簽完成其任務並很好地擴展移動環境。

但是，問題仍然存在於document.documentElement.clientWidth 。 除非我包含某種類型的時間延遲或使用alert("") ， clientWidth和clientHeight返回默認值980和480。這對我來說很奇怪，因為它們在延遲適當的情況下可以正確顯示，但即使沒有返回默認值在window上的"load"事件偵聽window或document上的"readystatechange"事件偵聽器的回調函數中調用它們時。

Firefox for Android在執行JavaScript之前是否無法加載頁面？

問題描述

1 個解決方案

解決方案1
0 2015-02-06 21:15:05

Firefox for Android在執行JavaScript之前是否無法加載頁面？

問題描述

1 個解決方案

解決方案1 0 2015-02-06 21:15:05

解決方案1
0 2015-02-06 21:15:05