检查DOM元素类型/属性以将值分配给innerHTML或value

时间:2018-08-06 09:39:00

标签: javascript

我要查询所选容器中的所有内容。

container = document.querySelector('[data-container]')

我还有一个variable,其中包含一个值。

如果子元素具有value属性(如输入)

child.value = variable

如果不是,例如'p','div'使用:

child.innerHTML = variable

如何检查element / type属性?

我是否需要逐个检查标签,还是更通用?

1 个答案:

答案 0 :(得分:1)

您可以使用更通用的方法:in:它将检查对象(或其原型)上是否存在属性:

if ("value" in element) {
    // use value
} else {
    // Use innerHTML or textContent, etc.
}

示例:

var container = document.querySelector("[data-container]");
var children = container.children;
for (var n = 0; n < children.length; ++n) {
  var element = children[n];
  var hasValue = "value" in element;
  console.log(element.tagName, hasValue ? "has value" : "doesn't have value");
}
<div data-container>
  <p>Paragraph</p>
  <input type="text">
</div>