Является ли использование `innerHTML` единственным способом создания элемента` button` в JavaScript с атрибутом `type`? - PullRequest
3 голосов
/ 30 августа 2011

Я хотел сделать кнопку со следующим JavaScript ...

var button = document.createElement('button');
button.type = 'button';
button.appendChild(document.createTextNode('I am button'));
document.body.appendChild(button);

Это прекрасно работает, за исключением IE7 / 8 (все, что я тестировал до сих пор).

Сообщение: Object doesn't support this actionСтрока: 185Char: 9Код: 0URI: http://example.com/widget.js

Я нашел обходной путь ...

document.body.innerHTML = '<button type="button">I am button</button>';

То есть установите innerHTML и позвольте браузеру выполнить анализ.

jsFiddle .

Есть ли другой способ заставить это работать в IE без установки свойства innerHTML?

Ответы [ 3 ]

6 голосов
/ 30 августа 2011

Вы пробовали .setAttribute()?Следующее, похоже, работает в IE 8 (не тестировал в 7), Chrome, FF:

<html>
<body>
<script>
var button = document.createElement('button');
button.setAttribute('type','button')
button.appendChild(document.createTextNode('I am button'));
document.body.appendChild(button);
</script>
</body>
</html>
4 голосов
/ 30 августа 2011

Согласно этой статье , которую вы, возможно, видели, прямой createElement вызов DOM в IE7 / 8 не работает с элементом button, но он работает с input.

Возможно, вы правы в отношении innerHTML решений (и использование jQuery с исходным кодом HTML, что, по сути, одно и то же, IMHO) является единственным подходом.недостаток DOM в IE7 / 8.Очень интересная находка!

0 голосов
/ 30 августа 2011

Использование innerHTML заменяет все в элементе тем, что вы указали.

jQuery .append() работает в IE7 / 8: (и это намного проще)

$(document).ready(function() {
    $('body').append('<button type="button">I am a button</button');
});

ВотjsFiddle: http://jsfiddle.net/4ne48/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...