enthalten HTML-Code in js

Question

Ich habe eine grundlegende quastion. Kann ich einen HTML-Code in JS einfügen? (Mit "document.write")

Das ist mein HTML-Code:

<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> 

und ich möchte es sind in dieser Code JS

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

es eine Verbindung von diesem Code:

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

wie kann ich es tun?

der vollständige Code ist hierhttp://jsfiddle.net/tsnave/eSgWj/4/ Dank ..

Answer 1

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> 
'; 

Alles, was ich wirklich die Anführungszeichen zu einfachen Anführungszeichen wechseln tat, war, so dass die HTML-Attribute die Zeichenfolge up not mess tun. Wenn Sie in die Zeichenfolge innerHtml einfache Anführungszeichen setzen müssen, können Sie sie mit einem umgekehrten Schrägstrich zurücklassen, z. B .: innerHtml = ' Don\'t break me';

Answer 2

können Sie tun:

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

Answer 3

kann ich schließen HTML-Code in JS?

Wenn Sie damit meinen, können Sie HTML über Javascript ausgeben, dann ist die Antwort ja, z.

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>'; 
} 

Answer 4

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>'; 
} 

Editiert:

Es sollte funktionieren.

<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>'; 

} 

Answer 5

Eine andere Art und Weise, es zu tun ist, um die HTML in einem Script-Tag zu setzen:

<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> 

Dann können Sie es in Javascript bekommen

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

mit oder Verwenden Sie eine von mehreren Bibliotheken, die Ihnen dabei helfen. Code in einem Skript-Tag mit type="text/template" wird vom Browser nicht interpretiert oder angezeigt. Der Vorteil dieses Ansatzes gegenüber dem direkten Einfügen in eine Zeichenfolge in Javascript ist, dass Sie es weiterhin als normalen HTML-Code in Ihrem Editor behandeln können und das Javascript sauber bleibt. Siehe auch this post by John Resig.