如何用jQuery为包含多个关键词的链接添加SALE标识？

我有一批商品链接，想根据链接里的特定字符串给文本追加“SALE”标识。目前已经实现了给包含“SHIRT”的链接追加该文本，但现在想扩展成同时匹配“JACKET”等多个关键词，想问能不能用数组来实现这个需求？

现有HTML结构 #

<div>
    <div class="link"><a href="/products/WHITESHIRT">White Shirt</a></div>
    <div class="link"><a href="/products/BLACKSHIRT">Black Shirt</a></div>
    <div class="link"><a href="/products/GREENSHIRT">Green Shirt</a></div>
    <div class="link"><a href="/products/WHITESHORTS">White Shorts</a></div>
    <div class="link"><a href="/products/BLACKTROUSERS">Black Trousers</a></div>
    <div class="link"><a href="/products/YELLOWJACKET">Yellow Jacket</a></div>
</div>

当前jQuery代码 #

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    
<script>
$(".link a").each(function () {
    var href=$(this).prop('href');
    if (href.indexOf('SHIRT') > -1) {
    $(this).append(" SALE");
    }
});
</script>   

完全可以用数组实现多关键词匹配，既灵活又方便后续扩展，具体修改如下：

修改后的代码 #

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    
<script>
// 定义需要匹配的关键词数组，后续加新关键词直接往这里加就行
const saleKeywords = ['SHIRT', 'JACKET'];

$(".link a").each(function () {
    const href = $(this).prop('href');
    // 检查当前链接是否包含数组里的任意一个关键词
    const hasMatch = saleKeywords.some(keyword => href.indexOf(keyword) > -1);
    if (hasMatch) {
        $(this).append(" SALE");
    }
});
</script>

代码说明 #

1. 关键词数组：把所有需要触发“SALE”的关键词放在saleKeywords数组里，比如后续要给短裤（SHORTS）也加标识，只需要把'SHORTS'添加到数组中，不用改逻辑代码。
2. 匹配逻辑：用Array.some()方法遍历数组，只要链接的href包含数组里任意一个关键词，就返回true，执行追加操作。
3. 兼容旧浏览器写法：如果需要兼容不支持ES6语法的老浏览器，可以换成for循环实现：

var saleKeywords = ['SHIRT', 'JACKET'];

$(".link a").each(function () {
    var href = $(this).prop('href');
    var hasMatch = false;
    for (var i = 0; i < saleKeywords.length; i++) {
        if (href.indexOf(saleKeywords[i]) > -1) {
            hasMatch = true;
            break;
        }
    }
    if (hasMatch) {
        $(this).append(" SALE");
    }
});

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