1

cssHooks（jQuery）のようにjavascript / jQueryでcssプロパティをオーバーライドするにはどうすればよいですか？ただし、propは外部cssにあります。

例えば

index.html

<div id="test">abc</div>

styles.css

#test {background: red;}

そして、背景の小道具を使用するたびに、この要素を非表示にして、背景には何もしません。

「しかし、特定のdiv（#test）だけでなく、cssにバックグラウンドプロップがあるすべての要素に対して実行したい」

4

4 に答える 4

1

css プロパティbackgroundが設定されている要素を非表示にする場合は、これらの要素にクラスを追加するのが最善です。次に、クラスに基づいて要素を非表示にします。

以下の例では、 class を持つすべてのアイテムを非表示にしていbackground-setます。

$('.background-set').hide();

background悪い方法は、要素を取得して、プロパティが設定されていない場合に除外することです。div セレクターで検索を開始しましたが、必要に応じて拡張できます。

$('div').filter(function() {
    return $(this).css('background').replace('rgba(0, 0, 0, 0) none repeat scroll 0% 0%','').length > 0;
}).hide();
于 2012-04-09T18:28:59.647 に答える
1

jqueryを使用している場合は、次のことができます

$('#test').css('display','none');

これにより、要素が非表示になり、背景はそのまま残ります。

[編集]以前は質問を理解していなかったと思います。あなたのコメントによると、あなたがしたいことは、backgroundプロパティを使用しているものを変更することですか? これを行う方法があるとは思いません。私が考えることができる唯一のオプションは、すべての単一の DOM 要素をループして、element.style.background が設定されているかどうかを確認することです。

于 2012-04-09T18:16:55.027 に答える
0

javascript を使用して background プロパティを確認する場合、ブラウザによって異なる値が返されます。Chrome はrgba(0, 0, 0, 0) none repeat scroll 0% 0%背景が設定されていない要素を返すため、返された文字列の長さをチェックしても機能しません。他のブラウザは rgba をサポートしておらず、別の値を返す可能性があります。

あなたが本当にしなければならないことは、背景のプロパティが上記と一致するかどうかを確認することです.

var pattern=/rgba\(0\, 0\, 0\, 0\)/gi;

$.each($('*'), function(index, item) {
    var bg = $(item).css('background');
    if (!bg.match(pattern)) {
        $(item).hide();
    }
});

フィドル

于 2012-04-09T19:07:03.713 に答える
0

要素に直接設定されたスタイル値は、CSS で設定されたものをオーバーライドします。要素を非表示にする場合は、次のようにします。

$('#test').hide();

内部的には、これは設定の単なるショートカットですelem.style.display = "none";。

あなたの質問のこの部分は私たちを混乱させました:「私はbackground propを使用するたびに、この要素を隠してbackgroundには何もしません.」そのため、さらに回答が必要な場合は、質問の内容を明確にする必要があります。

要素を非表示にしても、背景はまったく変更されません (ただし、表示されなくなります)。要素を表示したまま背景を非表示にしようとしている場合は、背景を透明に戻す必要があります。

$('#test').css("background", "transparent");

このスタイル値を要素に直接設定すると、設定した CSS スタイルシート ルールが上書きされます。

于 2012-04-09T18:19:15.353 に答える