继续执行dom命令

Question

我在一些测试页面中使用这个dom命令：

document.querySelector('div#summary-item div.description').innerHTML || ""

但是在某些页面中，当第一部分不存在时，我不会收到第二部分＆＃34;＆＃34;但我收到此错误，我的程序停止

Uncaught TypeError: Cannot read property 'innerHTML' of null(…)

有没有简单的方法来接收＆＃34;＆＃34;不需要在if语句中使用typeof吗？

Answer 1

您不需要typeof，但确实需要if语句或其他流量控制。

var el = document.querySelector('div#summary-item div.description');
var data = "";
if (el)
  data = el.innerHTML;

或者它在这里使用条件运算符：

var el = document.querySelector('div#summary-item div.description');
var data = el ? el.innerHTML : "";

从技术上讲，通过使用具有.innerHTML属性的对象，可以在不使用流控制语句或表达式的情况下逃脱。

var data = (document.querySelector('div#summary-item div.description') || {innerHTML:""}).innerHTML;

但我觉得这很难看。 if语句是该语言的一部分。不知道你为什么要避免它。

当然，如果它真的困扰你，你总是可以使用一个抽象它的函数。

function htmlFromElem(selector) {
    var el = document.querySelector(selector);
    return el ? el.innerHTML : "";
}

然后像这样使用它：

var data = htmlFromElem('div#summary-item div.description')