What does junk mean next to an element (html/xml...)?

Question

In an HTML tag, I found a tag that I hadn’t seen before.

I looked it up, but I couldn’t find anything to help me.

She’s nesting a tag <li> and the code (changed) is like this:

<ul class="list-tabs-navigation list-inline">
    <#list (pageRender.getInstancesIds("SlotB"))! as id>
        <li class="tab-navigation-items state-default">
            <a class="item-navigation-link" href="#">qualquer 1</a>
        </li>
    </#list>
</ul>

What is the function of <#list?

Answer 1

Within the specification of HTML there is no such thing, so it is not something that any browser should recognize, and as far as I know none recognizes.

This is probably something inserted as specific syntax for some tool. It can be something that is interpreted in backend before sending to the browser or it may even be something that some framework of (frontend understands and knows what to do manipulating the DOM, what I find a terrible solution because even for this has specification and this is not how it does.

Other than that, it could be someone’s pure syntax error, some corruption, it could be some kind of comment that the person used to not consider that. You can’t know because the question has no context. But the most likely is the previous one, even by its syntax complement. Note that in common use is not even considered HTML

<ul class="list-tabs-navigation list-inline">
    <#list>
        <li class="tab-navigation-items state-default">
            <a class="item-navigation-link" href="#">qualquer 1</a>
        </li>
    </#list>
</ul>

I put in the Github for future reference.

It seems that Laércio Lopes gave the context and shows that it is a framework of backend same. He will interpret and do something with the code before sending to the browser you will receive something clean and simple.

Answer 2

This tag is not standard HTML, was created using marking components such as the documentation of the Freemarker explains.

Answering your question:

You use FTL tags to call directives. In the example, you called the listdirective. Syntactically you did it with two tags: <#list (pageRender.getInstancesIds("SlotB"))! as id> and </#list>.

There are two types of FTL tags:

Start-tag: <#directivename parameters>

Final tag: </#directivename>

This is similar to HTML or XML syntax, except for the name of the tag that starts with #. If the directive has no nested content (content between the initial tag and the final tag), you should use the initial tag without the final tag. For example, you write <#if something>...</#if>, but so <#include something> Freemarker knows that the include cannot have a nested content.

The format of Parameters depends on the directive.

In fact, there are two types of directives: predefined directives and user-defined directives . For user-defined directives, you use @ instead of #, for example <@mydirective parameters>...</@mydirective> . Another difference is that if the directive has no nested content, you should use a tag like <@mydirective parameters />, in the same way as in XML (for example <img ... />).

Tags FTL, as tags HTML, should be nested correctly. Therefore, the code below is wrong, because the ifdirective is inside and outside the nested content of the directive list:

<ul>
<#list animals as animal>
  <li>${animal.name} for ${animal.price} Euros
  <#if user == "Big Joe">
     (except for you)
</#list> <#-- WRONG! The "if" has to be closed first. -->
</#if>
</ul>

---

References in:

• Building Fluid Layouts
• Using Freemarker models
• All specifications and how to use