Como faço para criar dinamicamente uma em JavaScript que contém uma entidade HTML ( -… «)?

Question

Eu gostaria de adicionar umu003Coption> elemento para umu003Cselect> elemento onde ou003Coption> O texto do elemento contém uma entidade HTML: -

No HTML, o código seria assim:

<select name="test" id="test">
    <option value="">&mdash; Select One &mdash;</option>
</select>

Meu código JavaScript se parece com o seguinte:

function selectOne() {
  var e = document.getElementById('test');
  e.options[0] = new Option('— Select One —', '');
}

No entanto, como você verá se você testar isso, o - fica escapado. Eu tive o mesmo resultado quando tentei:

e.options[o].text = '— Select One —';

(O comportamento observado foi no Internet Explorer 7 ... não testou com o Firefox, Safari, etc. - Internet Explorer 7 é o único navegador que preciso no momento.)

Answer 1

Acabei de perceber que poderia usar um unicode JavaScript Escape:

e.options[0] = new Option('\u2014 Select One \u2014', '');

Answer 2

Você não precisa escapar da entidade - funciona assim:

function selectOne() {
      var e = document.getElementById('test');
      e.options[0] = new Option('— Select One —', '');
}

Answer 3

text A propriedade não é inigualável, pois deve ser tomada literalmente. Se você usar innerHTML, as entidades são convertidas para caracteres correspondentes.

e.options[o].innerHTML = '— Select One —';