Best way to store JSON in an HTML attribute?

The HTML does not have to validate.

Why not? Validation is really easy QA that catches lots of mistakes. Use an HTML 5 data-* attribute.

The JSON object could be any size (i.e. huge).

I’ve not seen any documentation on browser limits to attribute sizes.

If you do run into them, then store the data in a <script>. Define an object and map element ids to property names in that object.

What if the JSON contains special characters? (e.g. {test: ‘<“myString/>’})

Just follow the normal rules for including untrusted data in attribute values. Use &amp; and &quot; (if you’re wrapping the attribute value in double quotes) or &#x27; (if you’re wrapping the attribute value in single quotes).

Note, however, that that is not JSON (which requires that property names be strings and strings be delimited only with double quotes).

Leave a Comment