Question

我的代码中有更多的document.getElementById，但是当我运行我的代码时，只有两个document.getElementById（ctx1，ctx2）获取其他值的值。我怎样才能达到其他人（在我的情况下是ctx3）返回true并且我没有得到错误按摩。这是我的演示代码：

DEMO

var ctx1=document.getElementById("data1").getContext("2d");     
var ctx2 =document.getElementById("data2").getContext("2d");
var ctx3 =document.getElementById("data3").getContext("2d");

在这种情况下，ctx1和ctx2获取值但ctx3没有，这就是我在控制台中得到 document.getElementById（...）为空错误消息的原因。我有一些尝试，但这些都失败了。

ATTEMPT

1

if(ctx3 === null || 
   ctx3 === undefined) {
    return true;
}

2

if(document.getElementById("data3")..getContext("2d").value == null){
    return true;
  }

Answer 1

如果具有该ID的元素可能不存在，则需要分解您的陈述。你不能这样做：

// Not this
var ctx3 =document.getElementById("data3").getContext("2d");

...因为document.getElementById("data3")可能会返回null，然后您尝试将其用于.getContext("2d")时出错。所以相反：

var elm3 = document.getElementById("data3");
var ctx3 = elm3 && elm3.getContext("2d");

现在，如果您的文档中没有id="data3"元素，则elm3和ctx3都将为null。如果有，elm3将引用元素，ctx3将引用2D上下文。

如果你不止一次这样做，你可以给自己一个功能：

function getOptionalContext(id) {
    var elm = document.getElementById(id);
    return elm && elm.getContext("2d");
}

然后：

var ctx1 = getOptionalContext("data1");
var ctx2 = getOptionalContext("data2");
var ctx3 = getOptionalContext("data3");

旁注：每当您发现自己在撰写var1，var2，var3，...时，请考虑使用数组。

Answer 2

如果document.getElementById("data1")为undefined，( document.getElementById("data1") != null )将提供false。在这种情况下，如果getContext("2d") undefined，您可以轻松跳过var ctx1 = ( document.getElementById("data1") != null ) ? ( document.getElementById("data1") != null ).getContext("2d") : null; var ctx2 = ( document.getElementById("data2") != null ) ? ( document.getElementById("data2") != null ).getContext("2d") : null; var ctx3 = ( document.getElementById("data3") != null ) ? ( document.getElementById("data3") != null ).getContext("2d") : null;。希望这会有所帮助。

UPDATE user AS u
JOIN user_tmp AS t ON u.Contact_No = t.Contact_no
SET u.Name = t.Name, u.Status = t.Status;

Answer 3

如上所述，如果没有具有此类ID的元素，则会发生错误，因为.getElementById(...)方法返回null。并且您无法在null上调用方法，因为它没有相应的内置类（例如，数字具有Number内置类，这就是您可以调用的原因像3.0.toFixed()）这样的方法。考虑到T.J. Crowder关于使用数组的好建议，这是我的代码：

var selectors = ["data1", "data2", "data3"];
var contexts = selectors.map(function(selector) {
    var elem = document.getElementById(selector);
    return elem ? elem.getContext("2d") : true;
});

这将返回一个上下文数组（如果元素不存在，则在数组中其上下文的位置，true将出现）

如何设置document.getElementById（...）为空按摩为真

3 个答案: