如何用纯JS判断指定类名的元素是否不存在

完全不需要依赖jQuery这类库，用原生JS就能轻松实现你的需求。核心逻辑很简单：先检查页面中是否存在类名为taskparagraph的元素，若不存在则创建并添加另一个段落。

具体实现代码 #

假设你的目标容器是id为targetDiv的div（可根据实际情况修改选择器），完整代码如下：

// 获取目标div
const targetDiv = document.getElementById('targetDiv');

// 你原本创建带taskparagraph类的段落的代码（示例）
const taskPara = document.createElement('p');
taskPara.classList.add('taskparagraph');
taskPara.textContent = '带taskparagraph类的段落内容';
targetDiv.appendChild(taskPara);

// 检查是否存在taskparagraph类的元素
const taskParaExists = document.querySelector('.taskparagraph') !== null;

// 若不存在，添加另一个无关段落
if (!taskParaExists) {
  const otherPara = document.createElement('p');
  otherPara.textContent = '这是另一个无关段落';
  targetDiv.appendChild(otherPara);
}

精准检查（可选） #

如果你的需求是仅检查目标div内部是否存在该类元素（而非整个页面），可以缩小检查范围，避免误判页面其他地方的同类型元素：

// 只在目标div内查找taskparagraph类元素
const taskParaInDivExists = targetDiv.querySelector('.taskparagraph') !== null;

if (!taskParaInDivExists) {
  // 创建并添加无关段落的逻辑同上
}

内容的提问来源于stack exchange，提问作者asterisk