GWT：setInnerHTML unescapes属性值

Question

This string: <a onclick="doit('&#39;')">...</a> is received from the server-side and needs to be set as the inner HTML of an element.

When I use Element#setInnerHTML the string is converted to <a onclick="doit(''')">...</a> , ie unescapes the HTML entity to the character it represents.

How can I preform the inner HTML assignment with no entity conversions?

Clarification: The inner HTML assignment only unescapes entities inside attribute values.

Answer 1

The setInnerHTML() implementation itself poses no issue, since its only role is to assign a property value to the underlying JS object, as can be seen by examining Element 's source code:

public final native void setInnerHTML(String html) /*-{
    this.innerHTML = html || '';
}-*/;

The problem lies within the browser, innocently following the Charset Entity References guides in the HTML Document Representation specifications and parsing your entities, which are allowed (thus get parsed) inside attribute nodes.

From the specification:

Authors should also use " & " in attribute values since character references are allowed within CDATA attribute values.

Solution

On the server side (or via a filter or a designated client proxy), escape all special characters inside attribute values with the corresponding HTML entities, eg:

<a onclick=\"doit('&amp;#39;')\">...</a>

References on W3C

• HTML Document Representation · Charset .
• Character Entity Reference .