格式化HTML代码

Question

aI have a relatively sophisticated model that I need to render in HTML.

The problem I have is that a single line from the model could be significantly long and this will make the HTML code hard to read. Indenting separate tags does not work because it will create undesired spaces in the middle of the data.

For example if I have data that renders like:

<p style="..."><span style="...">...</span><span style="...">...</span><span style="...">...</span><span style="...">...</span></p>

something like

<p
    style="..."><span 
        style="...">...</span><span 
        style="...">...</span><span 
        style="...">...</span><span 
        style="...">...</span>
</p>

The problem with this is obvious, the opening tag is at the end of the previous line.

Is there a better option to achieve this?

Answer 1

It looks like your trying to avoid the space caused by the line breaks between span elements. If so you could try this trick. Still ugly but better than a single line.

   <span>a</span><!--
--><span>b</span><!--
--><span>c</span>

Answer 2

Maybe take a look at this Remove whitespace and line breaks between HTML elements using jQuery

and see if having a little jquery clean up the line breaks for you will help