0

大規模なelse ifステートメントを簡素化しようとしています。短いコードを取得するより良い方法はありますか? ほとんどの条件は、異なる css プロパティと、要素への挿入/追加の方法を使用しています..

助けてくれてありがとう！

var img = $("<img src='images//anim.gif class='Img'>");

            var cssProp = {'position':'absolute',
                       'z-index':99,
                       'top': topPos,
                       'left': leftPos
            }

//$element var represent all kinds of elements I have in my DOM           

            if($element.attr('id')=='count' || $element.attr('id')=='assign' ){
                img.prependTo($element)          
            }else if($element.is('#title')){
                cssProp.top=+20;
                img.insertBefore($element);

            }else if($element.is('#tab')){
                detail_img = $("<img src='images/anim.gif' id='tab1' class='Img'>");
                detail_img.insertBefore($element.parent());
                detail_img.css(cssProp);

            }else if($element.is('#tab2')){ 
                detail_img = $("<img src='images/anim.gif' id='tab2' class='Img'>");
                detail_img.insertBefore($element.parent());
                detail_img.css(cssProp);         

            }else if ($element.is('#e_btn')){
                cssProp.left=+20;
                cssProp.top=+3;
                img.insertBefore($element);
                img.css(cssProp);

            }else if($element.is('#date_set')){
                img.insertBefore($element);

            }else if($element.is('td')){
                img.prependTo($element).css(cssProp);

            }else if($element.is('#l_title')){
                cssProp.top+=10;
                img.insertBefore($element);
                img.css(cssProp);

            }else if($element.is('#status')){
                cssProp.top =+10;
                img.insertBefore($element).css(cssProp);

            }else if($element.is('label')){
                img.appendTo($element)

            }else if($element.closest('#divTab').length>0){
                ($element.attr('id')=='work')? cssProp.left+=10 : '';
                cssProp.top+=5;
                img.insertBefore($element);
                img.css(cssProp)
           }else{      
                img.insertBefore($element);
                img.css(cssProp)
            }
4

1 に答える 1

1

行数を減らすには:

  • すべてのif{}句内の式を 1 行に減らします。これはかなり簡単です。必要に応じて、 を使用$.extend()して操作しcssPropます。
  • 一部の式は同一であるため、それらのif条件は で合成できます||。
  • 空白行を削除します。

これにより、if/else チェーンが 49 行から 21 行に削減されます。

ランタイム効率を改善するには、次のステートメントから始めます。

var id = $element.attr('id');
var tag = $element.get(0).tagName;

OK、これで 2 行追加されます

次に、条件で、 jQuery 式を使用するのではなく、if文字列比較を実行しますid。tag唯一の例外はif($element.closest('#divTab').length>0)で、これは同じパターンに従いません。

于 2012-09-07T02:35:56.943 に答える