Question

由于某些原因，我的Javascript代码不起作用。但是当我删除一些Javascript行时，它工作正常。

我做错了什么？

HTML：

<span id="21" class="addon-price">€ 0,00 p.m.</span>
<span id="57" class="addon-price">€ 0,00 p.m.</span>

使用Javascript：

document.getElementById("17").innerHTML = "Gratis";
document.getElementById("18").innerHTML = "Gratis";
document.getElementById("19").innerHTML = "Gratis";
document.getElementById("20").innerHTML = "Gratis";
document.getElementById("21").innerHTML = "Gratis";
document.getElementById("47").innerHTML = "Gratis";
document.getElementById("52").innerHTML = "Gratis";
document.getElementById("57").innerHTML = "Gratis";
document.getElementById("62").innerHTML = "Gratis";

JSFiddle：https://jsfiddle.net/4e362pg3/5/

Answer 1

打开你的控制台。

未捕获的TypeError：无法设置null
的属性'innerHTML'

如果DOM中不存在该元素，则选择器将返回null。 null.innerHTML未定义，它会抛出错误并导致页面崩溃。

使用jQuery解决方案（因为您在问题中使用了jQuery标记）：

$("#17").html("Gratis);

即使“17”元素不存在，也不会使页面崩溃。

Answer 2

JavaScript代码很好。您正在获得异常，因为您正在尝试设置不存在的innerHTML标记。根据您的代码，成功运行的唯一两个是尝试设置57和21的span标记的代码。在所有其他代码中，JavaScript抛出异常并停止执行。

要修复它，您需要做的就是在条件中包装每个集合，以便在尝试设置值之前查看该元素是否存在。

if(document.getElementById("17")) {
    document.getElementById("17").innerHTML = "Gratis";
}

这是一个example，其中包含条件中的几个元素。

Javascript无法使用多行

2 个答案: