如何防止在线端渲染的空格？

Question

The context

I have the following code:

<ul>
    <?php foreach($users as $user){ ?>
    <li>
        <?php echo $user->name ?>
    </li>
    <?php } ?>
</ul>

It renders:

<ul>
    </ul>

When there are $users, everything works well. However, when there aren't, the <ul> is rendered with blank spaces in it, making it not attributable with the CSS selector :empty.

I managed to solve the problem by doing this:

<ul><?php foreach($users as $user){ ?>
    <li>
        <?php echo $user->name ?>
    </li>
    <?php } ?></ul>

It renders:

<ul></ul>

Without the like breaks in the code, the list is now empty (even empty of blank spaces), but I'm afraid to leave it that way and some other programmer fix the indentation and break it.

---

My question

Is there a way to add line breaks to the code without adding blank spaces or breaks to the rendered html element?

Answer 1

My question is: Is there a way to add line breaks to the code without adding blank spaces or breaks to the rendered html element?

You could use HTML comments

<ul><!--
    <?php foreach($users as $user){ ?>
    --><li><!-- …

This is a technique also used to fight the space between inline block elements, if you want to keep the HTML code readable.

Or you could of course use output buffering, and then replace those spaces before you return the output to the client (rather complex, if you want to do it right.)

And probably the most simple solution of all to your actual problem:

Why output the ul element at all, if there are not going to be any list items?

Surround the whole block with an if that checks how many elements the array contains – and just don’t output any of that stuff if there aren’t any.