JavaScript学习笔记:jQuery内容选择器的原生实现

in #javascript6 years ago

深入学习jQuery选择器系列第五篇——过滤选择器之内容选择器

jQuery 很好用,但如果只是偶尔用到,那么引入这么大一个库恐怕就得不偿失了。何况学习的时候,总是要搞明白各种实现方法的。偏偏网上大多数试图实现 no jQuery 的教程都浅尝辄止,没有涉及到内容选择器等没有对应 CSS 选择器的语法。在自己摸索出 :contains 的原生实现后,查到了这篇博文——写得很好,我决定用 ES6 语法重写一下。

$('span:contains("test")').css('color','red')

const spans = document.getElementsByTagName('span');
for (const span of spans) {
    if(span.textContent.includes('text')) {
        span.style.color = 'red';
    }
}

原作者已经提供了详细的过程,我就不重复了,总之思路就是用循环语句获取全部元素再来判断。

Sort:  

帅哥/美女!这是哪里?你是谁?我为什么会来这边?你不要给我点赞不要点赞,哈哈哈哈哈哈。假如我的留言打扰到你,请回复“取消”。

Coin Marketplace

STEEM 0.20
TRX 0.25
JST 0.038
BTC 96907.08
ETH 3380.66
USDT 1.00
SBD 3.23