無法從.xhtml文件擴展名運行JavaScript;適用於.html

我無法在xhtml文件中運行基本的javascript函數，如alert等。請參閱下面的xhtml文件：無法從.xhtml文件擴展名運行JavaScript;適用於.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<meta content="text/html;charset=UTF-8" /> 
<title>My HTML</title> 
</head> 
<body> 
<h1>MyHTML</h1> 
<p id="mytext">Hello World! This is a test.</p> 
<input type="button" value="Alert" onClick="displayAlert()" /> 
<input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" /> 
<input type="button" value="Open Dialog" onClick="openAndroidDialog()" /> 
<input type="button" value="Add highlight" onClick="changeColor()" /> 

<script language="javascript"> 
    function showAndroidToast(toast) { 
     JSInterface.showToast(toast); 
    } 

    function openAndroidDialog() { 
     JSInterface.openAndroidDialog(); 
    } 

    function callFromActivity(msg) { 
     alert(msg); 
     var oldHTML = document.getElementById("mytext"); 
     alert(oldHTML); 
     var newHTML = "<span style='color:#ff0000'>" + msg + "</span>"; 
     alert(newHTML); 
     document.getElementById("mytext").innerHTML = newHTML; 
    } 

    function changeColor() { 
     var oldHTML = document.getElementById("mytext").innerHTML; 
     var newHTML = "<span style='color:#ff0000'>" + oldHTML + "</span>"; 
     document.getElementById("mytext").innerHTML = newHTML; 
    } 

    function displayAlert() { 
     <![CDATA[ 
     window.alert("I am here!"); 
     ]]> 
    } 

</script> 

</body> 
</html>

在Chrome/Safari瀏覽器中呈現時，沒有任何功能（如ChangeColor等）可以使用。將相同的文件重命名爲*.html會導致所有功能正常工作。我讀了很多材料，導致我：
1.嘗試CDATA標記並將所有內容放入函數中。
2.將MIME類型更改爲text/html。

所有這一切都無濟於事。任何人都可以告訴我爲什麼會發生這種情況，以及我如何從xhtml運行javascript函數？

來源

2013-06-23 Sriram

.html是xhtml的擴展。 – Lidor

如果你的Content-Type頭是正確的，那麼文件擴展名是沒有意義的，你對這個問題的假設是錯誤的。這可能意味着當你使用文件擴展名「.xhtml」時，你的Content-Type頭是不正確的。 – Brad

@Lidor：那就是.xhtml。 – BoltClock

隨着.xhtml擴展名，Chrome（WebKit）將假定媒體類型爲application/xhtml+xml。使用.html，媒體類型爲text/html。

現在application/xhtml+xml比text/html靈活性低很多，並且您的文件具有無效標記。當作爲text/html處理時，瀏覽器打得很好。當這種類型是application/xhtml+xml，它不那麼溫柔。

簡而言之，要作爲.xhtml工作，您必須使您的文件有效。有很多在它的錯誤（你以後可能會here檢查它們），必要的是：

更改<script language="javascript">到<script type="text/javascript">。
爲註釋（//）的script標籤之前，請從displayAlert()的<![CDATA[和]]>，並在之後將它們放在/：
```
<script type="text/javascript"> 
//<![CDATA[ 
... 
//]]> 
</script> 
```
最後，對於XHTML沒有onClick屬性。他們是onclick（全部小寫）。所以在你的input中改變它們。
就這樣一切都有效，將input s換成div標籤。

最終XHTML：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<meta content="text/html;charset=UTF-8" /> 
<title>My HTML</title> 
</head> 
<body> 
<h1>MyHTML</h1> 
<p id="mytext">Hello World! This is a test.</p> 
<div> 
<input type="button" value="Alert" onclick="displayAlert()" /> 
<input type="button" value="Say hello" onclick="showAndroidToast('Hello Android!')" /> 
<input type="button" value="Open Dialog" onclick="openAndroidDialog()" /> 
<input type="button" value="Add highlight" onclick="changeColor()" /> 
</div> 
<script type="text/javascript"> 
//<![CDATA[ 
    function showAndroidToast(toast) { 
     JSInterface.showToast(toast); 
    } 

    function openAndroidDialog() { 
     JSInterface.openAndroidDialog(); 
    } 

    function callFromActivity(msg) { 
     alert(msg); 
     var oldHTML = document.getElementById("mytext"); 
     alert(oldHTML); 
     var newHTML = "<span style='color:#ff0000'>" + msg + "</span>"; 
     alert(newHTML); 
     document.getElementById("mytext").innerHTML = newHTML; 
    } 

    function changeColor() { 
     var oldHTML = document.getElementById("mytext").innerHTML; 
     var newHTML = "<span style='color:#ff0000'>" + oldHTML + "</span>"; 
     document.getElementById("mytext").innerHTML = newHTML; 
    } 

    function displayAlert() { 

     window.alert("I am here!"); 

    } 
//]]> 
</script> 

</body> 
</html>

來源

2013-06-23 07:33:25 acdcjunior

+1，但您的第一句話不完全正確。它不是瀏覽器，而是_system_（網絡服務器或本地操作系統），它根據擴展名決定文件類型。 –

@MrLister謝謝！當從服務器提供文件時，mime類型肯定由HTTP標頭設置。但是，從文件系統打開時，這似乎有些模糊。當然，它應該由操作系統內容類型映射確定，但是，例如，我在windows下，我的'HKEY_LOCAL_MACHINE \ SOFTWARE \ Classes \ .xhtml'具有'text/html'的'Content Type'鍵值，但是Chrome瀏覽器（實際上，所有瀏覽器）仍將MIME類型視爲更爲嚴格的'application/xhtml + xml'，因此我的答案是聲明。我可以改說一下嗎？ – acdcjunior

哦！對不起！我沒有測試過。事情是，我知道IE8不會正常打開XHTML文件，但如果將.xhtml的註冊表項更改爲text/html，則會出現這種情況。所以在我的傲慢我沒有檢查，但我認爲其他瀏覽器也使用該註冊表項。事實證明，他們沒有，他們只看文件擴展名。所以你是對的，你不應該編輯你的答案。 –

acdcjunior指出，斯利拉姆的原始.xhtml文件是無效的。從Sriram的肯定回答中，我發現糾正他的語法解決了他的問題。

但是，我在下面的例子中展示了一個完全有效的.xhtml文件無法執行javascript的例子，如果我將其擴展名更改爲.html，即時生效。

考慮一個簡單的文件，我命名爲hello.xhtml：

<?xml version="1.0" encoding="UTF-8"?> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
     <title>Hello world</title> 
    </head> 

    <body> 
     <p> 
      Hello 
      <script type="text/javascript" src="./world.js"></script> 
     </p> 
    </body> 
</html>

它想執行這個JavaScript文件，名爲世界。JS：

document.write(' world');

我首先注意到hello.xhtml完美驗證上https://validator.w3.org/，所以我不認爲有任何語法錯誤。但是，當我在Firefox（當前最新的prd版本，47.0）中加載hello.xhtml時，它沒有提到有錯誤，但是它沒有在網頁中顯示單詞「world」。

但是，如果我只是將文件擴展名更改爲.html，那麼Firefox會完美地加載頁面（文本「hello world」出現）。

發生了什麼事？

來源

2016-06-09 14:15:13 HaroldFinch

無法從.xhtml文件擴展名運行JavaScript;適用於.html

回答

相關問題