maquette - How do you use html entities in maquette hyperscript?

Question

I want to use the © entity in maquette, but when I pass it as a child it comes out as plain text. I suppose I could use ©, but what's the fun in that?

Answer 1

Unfortunately, Javascript does not have the entities that HTML has. I know of 3 ways to get things like the copyright symbol in hyperscript:

  maquette.dom.append(document.body, h('div', [
    h('div', {innerHTML: '© 2016'}), // See warning below
    h('div', ['© 2016']),
    h('div', ['\251 2016'])
  ]));

The first one uses innerHTML, which should be used with caution, because it can make your web application vulnerable to XSS attacks.

The second way is the solution that you already mentioned. You need to encode your Javascript using utf-8 for this to work (but it is 2016, everyone uses utf-8 right?).

The last way uses the character code.