为什么document.getElementById不能仅由Firefox识别

Question

我有以下代码,它只是从列表中生成随机序列.它在Chrome和Safari中运行良好:

var strings = [
 	'For he who can wait, everything comes in time.',
    'We will wait to see if it is a doozy before we decide how to cover it, and what it all means.',
    'We need to talk about what we are going to do and see and decide. We\'ll have to wait and see.'
];

var rand = strings[Math.floor(Math.random() * strings.length)];
document.getElementById('loading-text').innerText = rand;

.loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background: #ddd;
    padding-top: 100px;
}
.loading-gif {
    display: block;
    width: 50px;
    height: 50px;
    background: #aaa;
    margin: 10px auto;
}

<div id="container" class='loading' >
     <div id='loading-text' class='loading-text'></div>
     <img class="loading-gif" id="processing" src= "images/squares.gif"/>
</div>

但是当我在Firefox中运行时,JavaScript无效(例如,不生成随机字符串).我怎样才能启用它？

Answer 1

你误解了这个问题.

Firefox不支持非标准的innerText属性.

请textContent改用.

var strings = [
 	'For he who can wait, everything comes in time.',
    'We will wait to see if it is a doozy before we decide how to cover it, and what it all means.',
    'We need to talk about what we are going to do and see and decide. We\'ll have to wait and see.'
];

var rand = strings[Math.floor(Math.random() * strings.length)];
document.getElementById('loading-text').textContent = rand;

.loading {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background: #ddd;
    padding-top: 100px;
}
.loading-gif {
    display: block;
    width: 50px;
    height: 50px;
    background: #aaa;
    margin: 10px auto;
}

<div id="container" class='loading' >
     <div id='loading-text' class='loading-text'></div>
     <img class="loading-gif" id="processing" src= "images/squares.gif"/>
</div>