使用 JavaScript 检查元素是否包含特定文本
检查元素是否包含特定文本:
- 使用元素的 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('Jiyik')) {
console.log('✅ Jiyik 包含在元素中');
} else {
console.log('⛔️ Jiyik 不包含在元素中');
}
我们使用 textContent 属性来获取元素及其后代的文本内容。
我们使用 String.includes
方法来检查元素是否包含特定文本。
includes()
方法执行区分大小写的搜索并检查提供的字符串是否包含在调用它的字符串中。
// 👇️ true
console.log('apple'.includes('app'));
// 👇️ false
console.log('apple'.includes('banana'));
如果要执行不区分大小写的检查文本是否包含在元素中,则必须将元素的文本内容和要检查的字符串转换为小写。
const container = document.getElementById('container');
const fruit = 'JIYIK';
if (container.textContent.toLowerCase().includes(fruit.toLowerCase())) {
console.log('✅ jiyik 包含在元素中');
} else {
console.log('⛔️ Jiyik 不包含在元素中');
}
通过将我们要比较的两个字符串都转换为小写,我们能够执行不区分大小写的比较。
如果元素的文本内容包含特定的字符串,我们的 if 块将运行,否则 else 块运行。
相关文章
使用 CSS 和 JavaScript 制作文本闪烁
发布时间:2023/04/28 浏览次数:146 分类:CSS
-
本文提供了使用 CSS、JavaScript 和 jQuery 使文本闪烁的详细说明。
在 JavaScript 中从字符串中获取第一个字符
发布时间:2023/03/24 浏览次数:93 分类:JavaScript
-
在本文中,我们将看到如何使用 JavaScript 中的内置方法获取字符串的第一个字符。
在 JavaScript 中获取字符串的最后一个字符
发布时间:2023/03/24 浏览次数:141 分类:JavaScript
-
本教程展示了在 javascript 中获取字符串最后一个字符的方法