Question

我有两个文件：一个名为simplecart.js的javascript文件，它创建一个值，显示在<span id="quantity" class="simpleCart_quantity"></span>的另一个文件中，一个html文件。 html文件包含以下代码：

<span id="quantity" class="simpleCart_quantity"></span>
<span id="quantityText"></span>

  <script type="text/javascript">
    var quantity = document.getElementById("quantity"),
        quantityText = document.getElementById("quantityText");
    if (parseInt(quantity.innerHTML, 10) === 1) {
        quantityText.innerHTML = "article";
    } else {
        quantityText.innerHTML = "articles";
    }
</script>

问题是： 似乎代码无法获得<span id="quantity" class="simpleCart_quantity"></span>之间的值（请记住，该值是在外部文件simplecart.js中创建的），现在alwasy显示“文章”，因为它无法看到值为'1'。

我希望有人可以帮我解决这个问题，非常感谢！

Answer 1

根据simplecart.js文件的外观，很可能您的html文件中的javascript代码实际上运行得太早（在文档实际准备好之前）。您应该延迟任何DOM操作，例如with（或jquery）：

document.onload = function () {
    var quantity = document .......
}

最好使用绑定库（如Angular.js），但您可以定期更新该字段作为快速解决方案：

var updatePlural = function () {
    var quantity = document .......
}
setInterval(updatePlural, 250); // every 250ms

Answer 2

你需要延迟运行你的JS直到之后 JS填充数据运行的跨度。

由于你的脚本元素紧跟在它之后，它会立即拉出值。没有更好的方法可以确保其他JS 不首先运行。

如何将JS延迟到最佳时刻的具体细节将取决于simplecart.js中相关代码的运行时间，

使用在外部文件中创建的<span>值</span>

2 个答案: