0

あるページから h1 タグを隠そうとしていますが、現在は動的ページであるため、ターゲットにできるフックはありません。コンテンツをターゲットにするための CSS からの迅速な修正になることを期待していました。

私はいくつかの調査を行い、次の方法を試みました。

<div id="pageH1">
<h1>value</h1>
<div class="clear"></div>
</div>


h1[att~=value] {
    display:none;
}

h1[att=value] {
    display:none;
}

ただし、どちらも機能していません。これは CSS で実行できるものなのか、それとも JS を使用する必要があるのか​​疑問に思っていました。

4

4 に答える 4

0

CSS 経由でこれを行うことはできません。これは CSS4 の機能になる可能性がありますが、CSS3 では機能しません。

これは、javascript を介して行う必要があります。

簡単な jQuery の例を次に示します。( JSFiddle を見る)

$('h1:contains("value")').hide(); // Hide any h1 element that contains "value"

上記のコードは、次のすべての行に一致します。

<!-- All three h1 tags will be matched -->
<h1>value<h1>
<h1>value #2<h1>
<h1>This is another h1 with "value" #3</h1>

クラスを追加.no-hideして、次のことを行う ことができます。

// Hide all h1 tags with value, EXCEPT .no-hide
$('h1:contains("value"):not(.no-hide)').hide();

これにより、次のようになります。

<h1>value</h1>                                             <!-- Hidden -->
<h1>value #2</                                             <!-- Hidden -->
<h1>This is another h1 with "value" #3</h1>                <!-- Hidden -->
<h1 class="no-hide">This has value but will not hide</h1>  <!-- NOT Hidden -->

あなたが必要とすることをすることpure CSSは現在不可能です（私の知る限り、間違っている場合は修正してください）。

于 2013-07-11T15:39:28.360 に答える
0

：空の

cssセレクターがあるはずです..まもなく承認されることを願っています。

あなたの状況では、 :empty yetの使用はお勧めしません。

jQueryを使用します。

if ($('#element').is(':empty')){
  //your coding
}

また

if ($('h1').is(':empty')){
  //your coding
}

空の場合、「各」を「削除」するルーチンを適用するだけです。

$( 'h1:empty' ).remove(); /* take the h1 OUT of the DOM */

また

$( 'h1:empty' ).hide(); /* display:none, visibility:hidden, opacity:0 */
于 2013-07-18T15:35:34.753 に答える
0

CSS ソリューションは存在しませんが、単純な JavaScript 関数が問題を解決する可能性があります

function forContent (selector, content, action) {
  [].forEach.call (document.querySelectorAll (selector), function (h) {
    (content === null ||
     typeof content == 'function' && content (h.innerHTML) ||
     typeof content == 'string' && content == h.innerHTML ||
     content.test && content.test (h.innerHTML)) && action (h);
  });
}

サンプル フィドルを参照してください: http://jsfiddle.net/jstoolsmith/uL9DZ/

于 2013-07-11T15:43:26.177 に答える
-3

可視性を非表示のように使用できます

h1

{

可視性:非表示;

}

これを使用すると、h1タグを非表示にできます.....

于 2013-07-11T15:40:27.667 に答える