特定のcss属性が付与されているタグのみにClassを追加する方法

Question

特定のタグに、特定のcss属性が付与されていた場合にのみaddClassを有効化する方法はありませんか？

【実現したいこと】

下記のようにiframeが自動生成されるhtmlファイルで

styleに

clip: rect(1px, 1px, 1px, 1px)

が付与されているiframeについては「disable_embed」のclassをjQueryで追加したいです。

<iframe class="wp-embedded-content"></iframe>

<iframe class="wp-embedded-content" style="position: absolute; clip: rect(1px, 1px, 1px, 1px);"></iframe>
<!-- ↑このiframeタグにだけdisable_embedを追加したい -->

<iframe class="wp-embedded-content"></iframe>

<iframe class="wp-embedded-content"></iframe>

【試してみたこと】

下記のように、jQueryを記述してみたのですが、
この書き方では、どれか1つのiframeが条件に合致していると
すべてのiframeタグに「disable_embed」が追加されてしまいます。

    jQuery(function($) {
        if ($('iframe').css('clip') == 'rect(1px, 1px, 1px, 1px)') {
            $(this).addClass('disable_embed');
    } else {
    }
    });

条件に合致するタグのみにclassを付与するにはどのように記載すると良いでしょうか。

どうぞよろしくおねがいします。

Answer 1

$(function(){
  $('.wp-embedded-content').filter(function(){
    return $(this).css('clip')=="rect(1px, 1px, 1px, 1px)";
  }).addClass('disable_embed');
});

Comments

[Novz]

ありがとうございます。

こちらの方法に$(window).load(function()で最後に読み込ませたところ意図通り動作しました。

感謝しております。

Answer 2

eachメソッドを使ってください。

jQuery(function($) {
  $('iframe').each(function(){
    if ($(this).css('clip') == 'rect(1px, 1px, 1px, 1px)') {
      $(this).addClass('disable_embed');
    } 
  })
});

.each() | jQuery 1.9 日本語リファレンス | js STUDIO

Comments

[Novz]

ありがとうございます！こちらで動作しました！

これに

$(window).load(function()

で最後に処理を施したところ意図通りに動きました。

ありがとうございます。