Question

我试图简化我的大量其他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)
            }

Answer 1

减少行数：

将每个if{}子句中的表达式减少到一行 - 这非常简单。如有必要，请使用$.extend()来操纵cssProp。
有些表达方式相同，因此if条件可以与||合成。
删除空行。

这样做，我将if / else链从49行减少到21行。

为了提高运行时效率，请从以下语句开始：

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

好的，这会在

中添加2行

然后，在if条件下，对id和tag执行字符串比较，而不是使用jQuery表达式。唯一的例外是if($element.closest('#divTab').length>0)，它不遵循相同的模式。

简化Massive if else语句

1 个答案: