Javascript Innerhtml - 奇怪的風格的東西

我有一個拉伸的部分，其中有多個部分。這些部分在我的CSS中對齊爲「合理」。在普通的HTML代碼中，這可以正常工作。像這樣：Javascript Innerhtml - 奇怪的風格的東西

Normal HTML - Example 1 我想用js innerhtml創建這個菜單。這是因爲菜單上的<a>標籤包含JavaScript功能。問題是，當js可用時，<a href>必須執行javascript函數，否則必須打開一個普通的url。

我試過這樣的事情，但是當js可用時，瀏覽器在函數執行後仍然會打開href url（當然）。

<a href='when_js_is_not_available.html' onclick='whenJsIsAvailable()'>Link</a>

我發現的東西：

<section id=menu> 
    <script> 
     loadMenu(); 
    </script> 

    <noscript> 
     //Working html code, as showed on example 1 
    </noscript> 
</section>

的Javascript：

function loadMenu(){ 
    document.getElementById('menu').innerHTML="" 
      +"<a href='javascript:about()'><section class='linkNav'>Over NKika</section></a>" 
      +"<a href='javascript:donate()'><section class='linkNav'>Doneren</section></a>" 
      +"<a href='#'><section class='linkNav'>Inschrijven</section></a>" 
      +"<a href='#'><section class='linkNav'>Fotos</section></a>" 
      +"<a href='#'><section class='linkNav'>Links</section></a>" 
      +"<section id='stretch'></section>"; 
}

這將返回相同的HTML代碼，例如1。然而，樣式是不一樣的：
Wrong styling。拉伸或類似的東西出了問題。

該問題與CSS無關，因爲在示例1中一切都很好。

代碼在Chrome和Firefox的開發者工具中看起來完全一樣。

我一直在這工作數小時，並嘗試了很多，但我不知道如何解決此問題。感謝您的幫助。

來源

2014-02-09 user3290463

您能夠在JavaScript中使用NOT來發布HTML內容嗎？完全猜測，鏈接是否應該放在'

'而不是之前？ – Carl

http://puu.sh/6Qg7S/aaa62f4e00.png 我試過了，但那對我沒有用。無論如何感謝 – user3290463

這個怎麼樣：

<script> 
var onclicks=document.querySelectorAll('a[onclick]'); 
for (index in onclicks) 
{ 
onclicks[index].href='#'; 
} 
</script>

我們選擇與定義onclick事件每一個錨，然後將其href屬性#。所以，如果瀏覽器有JS，這會觸發，並刪除href s。如果沒有JS，那麼這當然不會觸發，並且原始的href將保持完整。

來源

2014-02-09 21:09:09 chiliNUT

謝謝！這對我有效 – user3290463

Javascript Innerhtml - 奇怪的風格的東西

回答

相關問題