Ext JSやRapid Driveなど
システム開発の技術情報をご紹介。

お電話でお気軽にお問い合わせくださいTel 03-6805-2904 営業時間 [平日]AM 9:30 - PM 6:30

Ext JSによるCSSセレクタの利用

E{display=none}

HTMLコード

<p style="color:red">message …</p>
<p style="color:blue">message …</p>
<p style="color:green">message …</p>

JSコード

Ext.select( ‘p{color=blue}‘, true ).each(function(el){

    el.setStyle({
        fontWeight: ‘bold’
    });

});

E{display^=none}

HTMLコード

<p style="color:red">message …</p>
<p style="color:blue">message …</p>
<p style="color:green">message …</p>

JSコード

Ext.select( ‘p{color^=g}‘, true ).each(function(el){

    el.setStyle({
        fontWeight: ‘bold’
    });

});

E{display$=none}

HTMLコード

<p style="color:red">message …</p>
<p style="color:blue">message …</p>
<p style="color:green">message …</p>

JSコード

Ext.select( ‘p{color$=d}‘, true ).each(function(el){

    el.setStyle({
        fontWeight: ‘bold’
    });

});

E{display*=none}

HTMLコード

<p style="color:red">message …</p>
<p style="color:blue">message …</p>
<p style="color:green">message …</p>

JSコード

Ext.select( ‘p{color*=r}‘, true ).each(function(el){

    el.setStyle({
        fontWeight: ‘bold’
    });

});

以下は動作検証がとれませんでしたので、検証後記述します。

E{display%=2}

E{display!=none}

HTMLコード

<p style="color:red">message …</p>
<p style="color:blue">message …</p>
<p style="color:green">message …</p>

JSコード

Ext.select( ‘p{color!=green}‘, true ).each(function(el){

    el.setStyle({
        fontWeight: ‘bold’
    });

});