三元运算在网站制作中的妙用

最近给客户制作网站的过程中，有个div折叠功能，div显示一部分内容，点击显示全部，再点击恢复部分显示，这种div折叠不同于显示隐藏，看到一个网站类似的折叠功能采用了大量的代码.

PS：三元运算 补脑 

（条件）？“真”：“假”

如果条件成立 执行 真，条件不成立执行 假

 var author_count = $('div.shufa_filter').find('dl:eq(2)').find('dd:eq(0)').find('a').length;
    if(author_count > 56) {
        author_hide();
    }
    function author_hide() {
        $('div.shufa_filter').find('dl:eq(2)').find('dd:eq(0)').css({"height":"100px","overflow":"hidden"});
        $('div.shufa_filter').find('dl:eq(2)').find('dd:eq(1)').show();
    }
    function author_show() {
        $('div.shufa_filter').find('dl:eq(2)').find('dd:eq(0)').css({"height":"auto","overflow":"auto"});
        $('div.shufa_filter').find('dl:eq(2)').find('dd:eq(1)').show();
    }
    $('div.shufa_filter').delegate('a.more', 'click', function(event){
        event.preventDefault(); 
        author_show();
        $(this).removeClass('more');
        $(this).addClass('back');
        $(this).html('收起>>');
    }).delegate('a.back','click',function(event){
        event.preventDefault();
        author_hide();
        $(this).removeClass('back');
        $(this).addClass('more');
        $(this).html('更多>>');
    });

以上代码繁琐，执行效率低下，使用三元运算可轻松实现以上功能。

<script type="text/javascript">
$(document).ready(function() {
/////////////////////////////////////
$("#author").on("click",function(){
var h=$('#shujia').css("height");
var t=$('#author').html();
(h=='80px')?$('#shujia').css('height','auto'):$('#shujia').css('height','80px') ;
(t=='显示全部')?$('#author').html("隐藏"):$('#author').html("显示全部") ;
})
})
</script>

当然以上代码还可以继续简化，有兴趣的朋友可以自己研究一下。