时间戳

首页 > 解决方案 > 如何防止在 JavaScript 数组中保存重复的段落？

javascript - 如何防止在 JavaScript 数组中保存重复的段落？

问题描述

这是我的代码。我很难弄清楚如何防止将重复数据保存到数组中。基本上，当我单击任何两个段落元素时，段落中包含的文本保存到名为 test.But 的数组中。但是，我希望，当我单击任何段落两次时，文本不能保存到数组中。我想防止任何双重输入。

var test = [];

[...document.querySelectorAll(".container")].forEach(div => div.addEventListener("click", function(e) {
  if (e.target.tagName === "P") {
    test.push(e.target.textContent);
  }
  console.log(test);
}));
<div class="container">
  <p>
    <b>Group:N</b>Code:1234<br/>
    <b> Session Type:CS<br/>
    <b> Location:Main Hall<br/>
    <b>Time:14:00<br/>
    <b>Day:Tuesday<br/>
    <b>Duration:1hour<br/>
  </p>
</div>
<div class="container">
  <p>	
    <b>Group:M</b>Code:98743<br/>
    <b> Session Type:NP<br/>
    <b> Location:Main Hall2<br/>
    <b>Time:11:00<br/>
    <b>Day:Monday<br/>
    <b>Duration:1hour<br/>
  </p>
</div>

标签： javascript

解决方案

您只需要检查数组是否已经包含该项目。如果它没有，则push否则忽略。用于Array.prototype.includes此。

var test = [];
[...document.querySelectorAll(".container")].forEach(div => div.addEventListener("click", function(e) {
  if (e.target.tagName === "P") {
    var text = e.target.textContent;
    if (!test.includes(text)) // This is the code to stop repeating elements.
      test.push(text);
  }
  console.log(test);
}));
<div class="container">
  <p>Paragraph 1</p>
  <p>Paragraph 2</p>
  <p>Paragraph 3</p>
</div>

推荐阅读