包括js中的HTML代碼

我有一個基本的準則。我可以在JS中包含一個HTMl代碼嗎？（以「文件撰寫」）包括js中的HTML代碼

這是我的HTML代碼：

<li><a href="#" class="menulink">text</a></li> 
<li><a href="#" class="menulink">text</a> </li> 
<li><a href="#" class="menulink">text</a> 
    <ul> 

     <li> 
      <a href="#" class="sub">text</a> 
      <ul > 
       <li class="topline"><a href="#">text</a></li> 
       <li><#">text </a></li> 
       <li><a href="#">text</a></li> 
       <li><a href="#">text</a></li> 
       <li><a href="#">text</a></li> 
       <li><a href="#"text</a></li> 
       <li><a href="#">text</a></li> 

      </ul> 
     </li> 
     <li> 
      <a href="#" class="sub">text </a> 
      <ul> 
       <li class="topline"><a href="#">text</a></li> 
       <li><a href="#">text</a></li> 



    </ul> 
</li> 

    <li> 
        <a href="#" class="sub"> text </a></li> 
      <li> 
        <a href="#" class="sub"> text </a></li> 
      </ul> 
     </li> 

      <li> 
    <a href="#" class="menulink">text</a> 


</li> 
<li><a href="#" class="menulink">text</a>

，我想包括在這個JS代碼

window.onload = function() { 
    document.getElementById("menu").innerHTML="";

這段代碼將它連接：

<p id="dropdown_menu"></p>

我該怎麼做？

完整的代碼是在這裏http://jsfiddle.net/tsnave/eSgWj/4/ 感謝..

來源

2012-08-31 Nave Tseva

我改變了代碼...請幫助我... –

document.getElementById("menu").innerHTML=' 
    <li class="topline"><a href="#">some text</a></li> 
    <li><a href="#">some text </a></li> 
    <li><a href="#">some text</a></li> 
    <li><a href="#">some text</a></li> 
    <li><a href="#"some text</a></li> 
    <li><a href="#">some text</a></li> 
    <li><a href="#">some text</a></li> 
';

所有我真的是行情切換到單引號，因此HTML屬性不亂串起來。如果您確實需要在innerHtml字符串中輸入單引號，則可以使用反斜線將它們轉義，即：innerHtml = ' Don\'t break me';

來源

2012-08-31 13:31:43 Dunhamzzz

我試過這個...它doeasnt工作..爲什麼？ –

什麼不適合它？你有錯誤嗎？ – Dunhamzzz

不......我只是不能看到瀏覽器中的文本... –

你可以這樣做：

document.getElementById("menu").innerHTML="<div>hello</div>"

來源

2012-08-31 13:32:03 DadViegas

我可以包括JS的HTML代碼？

如果你的意思是你可以通過JavaScript輸出HTML，那麼答案是肯定的，例如，

window.onload = function() { 
    document.getElementById("menu").innerHTML = '<li class="topline"><a href="#">some text</a></li> 
       <li><a href="#">some text </a></li> 
       <li><a href="#">some text</a></li> 
       <li><a href="#">some text</a></li> 
       <li><a href="#"some text</a></li> 
       <li><a href="#">some text</a></li> 
       <li><a href="#">some text</a></li>'; 
}

來源

2012-08-31 13:32:25 James

window.onload = function(){ 
    document.getElementById("menu").innerHTML='<li class="topline"><a href="#">some text</a></li><li><a href="#">some text </a></li><li><a href="#">some text</a></li><li><a href="#">some text</a></li><li><a href="#"some text</a></li><li><a href="#">some text</a></li><li><a href="#">some text</a></li>'; 
}

編輯：

它應該工作。

<script type="text/javascript"> 
window.onload = function(){ 
    document.body.innerHTML = 
     '<li><a href="#" class="menulink">text</a></li>' 
     +'<li><a href="#" class="menulink">text</a></li>' 
     +'<li><a href="#" class="menulink">text</a><ul>' 
     +'<li><a href="#" class="sub">text</a><ul>' 
     +'<li class="topline"><a href="#">text</a></li>' 
     +'<li><a href="#">text </a></li><li><a href="#">text</a></li>' 
     +'<li><a href="#">text</a></li><li><a href="#">text</a></li>' 
     +'<li><a href="#"text</a></li><li><a href="#">text</a></li></ul>' 
     +'</li><li><a href="#" class="sub">text </a><ul>' 
     +'<li class="topline"><a href="#">text</a></li>' 
     +'<li><a href="#">text</a></li></ul></li>' 
     +'<li><a href="#" class="sub">text</a></li>' 
     +'<li><a href="#" class="sub">text</a></li>' 
     +'</ul></li><li><a href="#" class="menulink">text</a></li>' 
     +'<li><a href="#" class="menulink">text</a>'; 

}

來源

2012-08-31 13:33:04

我回滾了編輯，因爲JS不支持字符串中的換行符。 – Florent

嗨。謝謝！我改變了上面的代碼，現在你的解決方案不起作用...你能幫我請求嗎？ –

確保有id =「menu」的html元素並在頁面加載後運行此代碼，修改答案嘗試它，應該可以工作。 –

做不同的方式是將HTML的腳本標籤中：

<script type="text/template" id="myHtml"> 
    <li class="topline"><a href="#">some text</a></li> 
    <li><a href="#">some text </a></li> 
    <li><a href="#">some text</a></li> 
    <li><a href="#">some text</a></li> 
    <li><a href="#"some text</a></li> 
    <li><a href="#">some text</a></li> 
    <li><a href="#">some text</a></li> 
</script>

然後你就可以得到它爲JavaScript的使用

var myHtml = document.getElementById('myHtml').innerHTML;

或使用其中的幾個庫來幫助你。瀏覽器不會解釋或顯示type="text/template"腳本標記內的代碼。這種方法在Javascript中直接插入字符串的優點是可以讓您在編輯器中將其視爲普通的HTML，並保持Javascript的清潔。另見this post by John Resig。

來源

2012-08-31 13:37:35 Supr

包括js中的HTML代碼

回答

相關問題