使用 JavaScript 检查元素是否包含特定文本

JavaScript 1年前 69

检查元素是否包含特定文本：

使用元素的 textContent 属性来获取元素及其后代的文本内容。
使用 includes() 方法检查元素中是否包含特定文本。
如果是，则 includes() 方法返回 true，否则返回 false。

这是本文中示例的 HTML。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>

  <body>
    <div id="container">
      <p>Apple, Banana, Pear</p>
      <p>Mango, Melon, Apricot</p>
    </div>

    <script src="index.js"></script>
  </body>
</html>

这是相关的 JavaScript 代码。

const container = document.getElementById('container');

if (container.textContent.includes('Zadmei')) {
  console.log('✅ Zadmei 包含在元素中');
} else {
  console.log('⛔️ Zadmei 不包含在元素中');
}

我们使用 textContent 属性来获取元素及其后代的文本内容。

我们使用 String.includes 方法来检查元素是否包含特定文本。

includes() 方法执行区分大小写的搜索并检查提供的字符串是否包含在调用它的字符串中。

// ?️ true
console.log('apple'.includes('app'));

// ?️ false
console.log('apple'.includes('banana'));

如果要执行不区分大小写的检查文本是否包含在元素中，则必须将元素的文本内容和要检查的字符串转换为小写。

const container = document.getElementById('container');

const fruit = 'ZADMEI';

if (container.textContent.toLowerCase().includes(fruit.toLowerCase())) {
  console.log('✅ zadmei 包含在元素中');
} else {
  console.log('⛔️ zadmei 不包含在元素中');
}