Wie lautet die Syntax, um einen Html-Codeblock in einer Javascript-Variablen zu speichern?
<div class='saved' >
<div >test.test</div> <div class='remove'>[Remove]</div></div>Ich möchte den obigen Code einer Variablen 'test' zuweisen
var test = "<div class='saved' >
<div >test.test</div> <div class='remove'>[Remove]</div></div>";aber es funktioniert nicht, welches ist die richtige Syntax für die Zuweisung des Codes?
TIA
Grüße! Ich weiß, dies ist ein älterer Beitrag, aber ich fand es durch Google bei der Suche nach "javascript fügen großen Block von HTML als Variable". Ich dachte, ich würde eine alternative Lösung posten.
Erstens würde ich empfehlen, die Variable selbst in einfache Anführungszeichen zu setzen ... das macht es einfacher, die doppelten Anführungszeichen im eigentlichen HTML-Code beizubehalten.
Sie können einen Backslash verwenden, um Zeilen zu trennen, wenn Sie eine gewisse Formatierung des Codes beibehalten wollen:
var code = '<div class="my-class"> \
<h1>The Header</h1> \
<p>The paragraph of text</p> \
<div class="my-quote"> \
<p>The quote I\'d like to put in a div</p> \
</div> \
</div>';Hinweis: Sie müssen natürlich alle einfachen Anführungszeichen innerhalb des Codes (z. B. innerhalb des letzten "p"-Tags) ausblenden
Wie auch immer, ich hoffe, das hilft jemandem, der nach der gleichen Antwort sucht wie ich ... Prost!
Können wir Backticks (``) ohne Fehler verwenden.. z.B.: <div>"test"<div>
wir können große Vorlagen (HTML) innerhalb der Backticks speichern, die im ES6-Javascript-Standard eingeführt wurden
Sonderzeichen müssen nicht entschlüsselt werden
Wenn keine Backticks vorhanden sind, müssen wir die Zeichen durch Anhängen von Backslash() entschlüsseln. z.B.:" \"test"""
Ich empfehle die Verwendung von mustache Rahmenwerk für Vorlagen. https://github.com/janl/mustache.js/ .
<body>
....................
<!--Put your html variable in a script and set the type to "x-tmpl-mustache"-->
<script id="template" type="x-tmpl-mustache">
<div class='saved' >
<div >test.test</div> <div class='remove'>[Remove]</div></div>
</script>
</body>
//You can use it without jquery.
var template = $('#template').html();
var rendered = Mustache.render(template);
$('#target').html(rendered);Warum ich das empfehle?
Früher oder später werden Sie versuchen, einen Teil der HTML-Variablen zu ersetzen und sie dynamisch zu machen. Der Umgang damit als HTML String wird Kopfschmerzen bereiten. Hier kann Ihnen die Schnurrbartmagie helfen.
<script id="template" type="x-tmpl-mustache">
<div class='remove'> {{ name }}! </div> ....
</script>y
var template = $('#template').html();
// You can pass dynamic template values
var rendered = Mustache.render(template, {name: "Luke"});
$('#target').html(rendered);Es gibt noch viele weitere Funktionen.
Als Referenz finden Sie hier einen Leistungsvergleich verschiedener Rendering-Techniken,
http://jsperf.com/zp-string-concatenation/6
m,
CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.
