0

「data-for」であるカスタムデータ属性が割り当てられているdivのリストがコードにあります。

私がする必要があるのは、URLの一部に一致するdata-for属性を持つdivを見つけることです。

たとえば、divのリストは次のようになります。

<div data-for="north-west"></div>
<div data-for="south-west"></div>
etc

現在のページのURLがhttp://www.mysite.com/shops/north-west.htmlの場合、北西のデータ属性（div data-for = "north-west）を持つdivを検索します。 ）そしてそれにIDまたはクラスを割り当てます。

誰かがこれで私を助けることができますか？divのリストは非常に長いため、スピーディーである必要があります。

よろしくお願いします。

4

5 に答える 5

2

パフォーマンスが気になる場合は、カスタム データ属性 (可能な限り遅いセレクター) を捨てて、代わりに ID を使用してください。

//Parse out the name of the HTML page you're on.
var selector = window.location.split('/')[2].replace('.html', '');
//Use it as your selector.
$('#' + selector).addClass('foo');

それ以外の場合は、次のセレクターを使用します。

$('div[data-for="' + selector + '"]').addClass('bar');
于 2011-10-24T13:57:37.860 に答える
2

jQueryのfilterメソッドが使える

デモ1

loc = location.pathname;

$("div[data-for]").filter(function(index){
    var obj = loc.match(this.getAttribute("data-for"));
    if(obj)
        return obj.length > 0;
    else
        return false;
}).css({color:"red"})

編集：またはさらに良い

デモ 2

$("div[data-for]").filter(function(index){
    var reg = new RegExp($(this).data("for"))
    return reg.test(location.pathname);
}).css({color:"red"});
于 2011-10-24T13:58:34.070 に答える
1 
$('div').each(function() {  // probably should use a more narrow selector
    var str = $(this).data('for'); // accesses 'data-for' attribute
    if (window.location.href.indexOf(str))>=0) {
        // match found; do something
    }
});
于 2011-10-24T13:57:09.200 に答える
0

Metadata プラグインはこれに非常に適しています。例えば

<div class="foo {bar: 'north-west'} baz"></div>

<script type="text/javascript">
$(function() {
    $('div').each(function() {
        var meta = $(this).metadata();
        console.log(meta);

        // And then do something with meta...
    });
});
</script>
于 2011-10-24T14:03:30.267 に答える
0

パス名を取得して、ファイル名以外のすべてを無料で置き換えることができるので、必要なものを手に入れることができます。

<script type="text/javascript">
    $(document).ready(function() {
        var data_for = window.location.pathname.replace(/^.*\/([^/]+).html/, '$1');
        $("div[data-for="+data_for+"]").something();
    });
</script>
于 2011-10-24T14:04:29.487 に答える