0

cssで次のように選択できます

li[class^=navs]{/*css code here*}

しかし、jqueryで上記のように選択するにはどうすればよいですか

私は試しましたが、間違っているようです：

$('li[class^=navs]').css(/*css code here*/);

引用符で試しました：

デモ

アップデート

html

<div id="banner"></div>

jquery

$(document).ready(function(){
$('#banner').prepend('<ul id="navs"></ul>');
for (var i = 1; i < 8; i++){
$('#navs').append('<li class="navs'+i+'"></li>');
}
$('li[class^="navs"]').css('width':'20px','height':'20px','background-color':'red');
});

更新されたデモ

4

6 に答える 6

4

値の前後に引用符が必要だと思います：

$('li[class^="navs"]').css(/*css code here*/);

あなたのフィドルから、CSS を設定する行はオブジェクトを取ります:

$('li[class^="navs"]').css('width':'20px','height':'20px','background-color':'red');

次のようにする必要があります。

$('li[class^="navs"]').css({'width':'20px','height':'20px','background-color':'red'});

使用していた構文は、プロパティを 1 つだけ設定する場合にのみ有効です ( .css(propertyName, value))。

于 2013-09-10T04:43:07.087 に答える
2 
$('li[class^="nav"]').css({color: 'pink'});

フィドル

于 2013-09-10T04:46:35.447 に答える
2

適切なオブジェクト リテラルを使用していません。css プロパティを でラップする必要があります{}。

$('li[class^="navs"]').css('width':'20px','height':'20px','background-color':'red');

次のようにする必要があります。

$('li[class^="navs"]').css({'width':'20px','height':'20px','background-color':'red'});
                           ^                                                       ^

これは、コードを合理的な方法でフォーマットすることを選択した場合、はるかに明確になります。

更新されたフィドル

これは、質問の元のバージョンの問題に対処します。

どちらの形式も値を引用符で囲む必要があります。ブラウザーは互換性を高めるために同様の構文をサポートしている可能性がありますが、jQuery はサポートしていません。

$('li[class^="navs"]')

もう 1 つの重要な注意点は、DOM ノードに存在するクラスの順序に依存してはならないということです。class="foo bar"と同等class="bar foo"です。

于 2013-09-10T04:43:38.157 に答える
1

あなたが持っている

$('li[class^="navs"]').css('width':'20px','height':'20px','background-color':'red');

そのはず

$('li[class^="navs"]').css({
    'width':'20px',
    'height':'20px',
    'background-color':'red'
});

に注意してください。複数の値があり、を見逃したが使用し{}た場合は、文字列ではなくオブジェクトを渡す必要があります。 デモ。css{}:

于 2013-09-10T04:56:49.580 に答える