0

私は現在このコードを使用しています：

コードはここで見ることができます - http://jsbin.com/ESOdELU/1/edit

var wordRandomizer = {
    run: function (targetElem) {
        var markup = this.createMarkup();
        targetElem.appendChild(markup);
    },
    createMarkup: function () {
        var that = this;
        var frag = document.createDocumentFragment();
        this.elem = document.createElement('span');
        var button = document.createElement('button');
        button.innerText = 'Change Item';
        button.addEventListener('click', function () {
            that.changeItem();
        });
        frag.appendChild(this.elem);
        frag.appendChild(button);
        return frag;
    },
    changeItem: function () {
        var rand = this.getRandInt(1, this.items.length) - 1;
        console.log(rand);
        this.elem.innerText = this.items[rand];
    },
    getRandInt: function (min, max) {
        return Math.floor(Math.random() * (max - min + 1)) + min;
    },
    items: ['itemA', 'itemB', 'itemC', 'itemD']
};
wordRandomizer.run(document.body);

コードは Chrome では正常に動作しますが、FireFox ではボタンが非常に小さく表示されて動作せず、IE ではコードがまったく動作しません。

4

1 に答える 1

6

問題はここにあります：

button.innerText = 'Change Item';

innerTextは有効な DOM プロパティではありません。一部のブラウザでサポートされている場合がありますが、標準ではないため、使用しないでください。

innerText次のいずれかに置き換えることができます。

  • textContent（これは、標準に準拠した直接的な同等物です）、

または

  • innerHTML（これは少し異なりますが、例では同じであり、古いブラウザと互換性があります）
于 2013-10-29T16:33:57.250 に答える