Question

选择器'Attribute Starts With' 根据文档选择具有指定属性的元素，其值始于给定字符串。我想做相反的事情 - 我想选择那些元素，其指定属性的值位于给定字符串的开头。

请考虑以下示例：

<a href="/about-us/">About us</a>
<a href="/products/">Products</a>
<a href="/contact/">Contact</a>

当前网址为/products/some-catogory/sub-category/product/?x=y&z=x，我想突出显示第二个菜单项。最好的方法是什么？

Answer 1

我建议：

var path = document.location.pathname;
$('a').filter(
    function(i,e){
        return $(this).attr('href').indexOf(path) == 0;
    }).addClass('highlight');

JS Fiddle demo

highlight类名称恰当地定义了突出显示。

使用以下HTML测试：

<a href="/about-us/">About us</a>
<a href="/products/">Products</a>
<a href="/_display/">_display</a>
<a href="/contact/">Contact</a>

请记住这是JS Fiddle的证明，因此它将匹配第三个a元素（因为那是匹配的元素。

编辑提供稍微更通用的解决方案，您可以在其中匹配给定的directroy /子目录：

function directory(path) {
    if (!path) {
        return false;
    }
    else {
        var _tmp = path.split('/'),
            directories = [];
        for (var i = 0, len = _tmp.length; i < len; i++) {
            if (_tmp[i].length > 0 && _tmp[i].indexOf('?') == -1) {
                directories.push(_tmp[i]);
            }
        }
        return directories;
    }
}
// in the real world use:
// var path = document.location.pathname,
var path = '/products/some-catogory/sub-category/product/?x=y&z=x',
    dir = directory('/products/some-catogory/sub-category/product/?x=y&z=x')[0];
$('a').filter(
    function(i, e) {
        return $(this).attr('href').indexOf(dir) == 0 || $(this).attr('href').indexOf('/' + dir) == 0
    }).addClass('highlight');

JS Fiddle demo

Answer 2

我不确定你要做什么，但你可以选择第二个项目：

a:contains("Products")

Answer 3

您可以使用:not和“属性开始时间”选择器来实现此目的。

例如： $('a:not([href^="whetever"])')

请参阅演示： http://jsfiddle.net/XH7Ut/

在jQuery中反转'Attribute Starts With'选择器

3 个答案: