如何在不定义变量的情况下使用 document.createElement(）

How to use document.createElement() without defining a variable

本文关键字：document createElement 情况下 定义 变量      更新时间：2023-09-26

我很确定我已经知道这个问题的答案，但我有点想要一个解释。

我想创建和附加一个元素，而不必在变量中定义它（这对我来说似乎是一种浪费，而且是不必要的）。

var errorMessage = document.getElementById("errorMessage");
 errorMessage.innerHTML = "";
errorMessage.appendChild(document.createElement('p').appendChild(document.createTextNode("Due to an egg allergy, your child will NOT receive the flu vaccine.")));

因此，这实际上将文本节点附加到 errorMessage 元素中，但不会生成"p"标签。

我只是认为，当这样更优雅时，您必须定义一个变量来创建新元素是荒谬的。我无法在网上找到任何关于这个的信息。有谁知道一种方法可以按照我想要的方式工作，或者可能知道为什么它不会以这种方式工作？

appendChild返回追加的子项。所以我想你想要

var text = "Due to an egg allergy, your child will NOT receive the flu vaccine.";
document.getElementById("errorMessage")
  .appendChild(document.createElement('p'))
  .appendChild(document.createTextNode(text));

我不确定我是否理解您要实现的目标，但是如果您想简单地将errorMessage元素的HTML设置为某些HTML，为什么不直接使用innerHTML属性呢？

errorMessage.innerHTML = '<p>Due to an egg allergy, your child will NOT receive the flu vaccine.</p>';

如果你不止一次这样做，请创建一个抽象

function createP(text) {
  var p = document.createElement('p');
  p.appendChild(document.createTextNode(text));
  return p;
}
document.body.appendChild(createP('hello world'));
相关文章：