如何過多文字顯示更多按鈕,點擊可顯示更多文字或者隱藏部分文字

由於介紹比較多，可以將部分文字隱藏，點擊更多按鈕，將全部文字顯示出來

同時，如果文字全部顯示出來，就顯示“收縮”

 直接上js代碼

 function showmore(contentid){
        var len = 300;      //默認顯示字數
        var ctn = document.getElementById(contentid);  //獲取div對象
        var content = ctn.innerHTML;                   //獲取div里的內容
content2 = content.replace(/(^\s*)|(\s*$)/g, ""); 
content2= content2.replace(/<[^>]+>/g,"");//去掉所有的html標記

 //alert(content);
        var span = document.createElement("span");     //創建<span>元素
        var a = document.createElement("a");           //創建<a>元素
        span.innerHTML = content2.substring(0,len);     //span里的內容為content的前len個字符

        a.innerHTML = content.length>len?"... 展開":"";  ////判斷顯示的字數是否大於默認顯示的字數    來設置a的顯示        
        a.href = "javascript:void(0)";//讓a鏈接點擊不跳轉

        a.onclick = function(){
            if(a.innerHTML.indexOf("展開")>0){      //如果a中含有"展開"則顯示"收起"
              a.innerHTML = "<<&nbsp;收起";
              span.innerHTML = content;
            }else{
                a.innerHTML = "... 展開";
                span.innerHTML = content.substring(0,len);
            }
        }
        // 設置div內容為空，span元素 a元素加入到div中
        ctn.innerHTML = "";
        ctn.appendChild(span);
        ctn.appendChild(a);
     }        

前台調用的時候寫上：

showmore('aboutuscontent');//aboutuscontent是id名