I am trying to output html with jQuery.
$('body').append('
<div>
<div>
<div></div>
</div>
</div>
');
I want to indent the code in this way for higher readability. It works for php but not in JS, any ideas? I use notepad++ as editor.
-
1what do you mean by it's not working in JS ?Mohammed Swillam– Mohammed Swillam2011-03-26 19:30:22 +00:00Commented Mar 26, 2011 at 19:30
Add a comment
|
5 Answers
You should be using a templating system for that. No matter how much indentation you use, if you mix to much HTML and Javascript you will end-up will spaghetti code.
HTML
<script type="text/template" id="my-template">
<div>
<div>
<div></div>
</div>
</div>
</script>
Javascript
$('body').append($('#my-template').html());
If you need more control over your template rendering, you need to use a library. I recommend underscore.js, its not the best templating engine for javascript, but it's very lightweight and comes with a great set of helper functions.
Comments
$('body').append('\n\
<div>\n\
<div>\n\
<div></div>\n\
</div>\n\
</div>\n\
');
- The
\nis to insert a newline character in your string (so it’ll get outputted in your body element) - The final
\is Javascript's line continuation character, so you can keep your JS code indented without having to add+ ''everywhere.
Comments
Try something like this:
$('body').append('\
<div>\
<div>\
<div>foo</div>\
</div>\
</div>');
Comments
Have you tried using the Javascript string literals? "\n" is a newline, and "\t" is a tab.
Comments
If you want to indent, I suggest using the concatenation operator "+" whenever you want to add a new line in your code:
$('body').append(
'<div>' +
'<div>' +
'<div></div>' +
'</div>' +
'</div>'
);
