Showing HTML comment strings (<!-- -->) in HTML files

Question

Hello all.

I'm building a source code search engine, and I'm returning the results on a HTML page (aspx to be exact, but the view logic is in HTML).

When someone searches a string, I also return the whole line of code where this string can be found in a file. However, some lines of code come from HTML/aspx files and these lines contain HTML specific comments ().

When I try to print this line on the HTML page, it interprets it as a comment and does not show it on the screen....how should I go about solving this so that it actually shows up?

Any help would be welcomed. Thanks.

Answer 1

As with any other HTML — covert special characters to entities. In particular < to <

Answer 2

Escape the characters < and > to < and >

see also: http://en.wikipedia.org/wiki/List_of_XML_and_HTML_character_entity_references

Answer 3

Any time you output text into an HTML page, you must HTML-encode it. If you don't then not only will comments (and other markup-like strings) disappear, but you'll also have great big cross-site-scripting security holes, as potentially untrusted parties will be able to insert <script> into your security context.

(aspx to be exact

In .NET the HTML-encoding method is called, naturally enough, HTMLEncode. You might also use a web control that HTML-encodes automatically for you, for example a Literal with literalmode encode.

but the view logic is in HTML)

Not sure what you mean by that but if you're using innerHTML to set content from script, you'll need to write your own HTML-encoder, as there isn't one built in to JS:

// HTML-encode a string for use in text content or an attribute value delimited by
// double-quotes
//
function HTMLEncode(s) {
    return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/"/g, '&quot;');
}

or, potentially better, use DOM methods and properties to set dynamic content rather than messing with HTML strings. (For setting text content, use element.textContent=, falling back to element.innerText for IE which doesn't support it.)

Answer 4

You can use XML CDATA for this:

<![CDATA[ 
  some text with <!-- comments -->
]]>;