我如何将所有这些函数压缩到一个Javascript中

How can I compress all of these function into one Javascript

本文关键字:一个 Javascript 所有这些 压缩 函数      更新时间:2023-09-26

这段代码使额外的段落出现,当我点击一个锚标记,但我不希望所有这些功能,因为它变得混乱,我想知道我如何能压缩这段代码成一个单一的函数,我不介意jquery,但我更喜欢javascript,但只是做什么是更有效的

    function showmore1()
            {
                var more_1 = document.getElementById("learnmore_1");
                if (more_1.style.display == "block") 
                {
                    more_1.style.display = "none";
                    document.getElementById('showmore_1').innerHTML ='<a>Even More History</a>';
                }
                else 
                {
                    more_1.style.display = "block";
                    document.getElementById('showmore_1').innerHTML ='<a>Show Less</a>';
                }
                }
    function showmore2()
            {
                var more_2 = document.getElementById("learnmore_2");
                if (more_2.style.display == "block") 
                {
                    more_2.style.display = "none";
                    document.getElementById('showmore_2').innerHTML ='<a>Even More Why programming</a>';
                }
                else 
                {
                    more_2.style.display = "block";
                    document.getElementById('showmore_2').innerHTML ='<a>Show Less</a>';
                }
                }
    function showmore3()
            {
                var more_3 = document.getElementById("learnmore_3");
                if (more_3.style.display == "block") 
                {
                    more_3.style.display = "none";
                    document.getElementById('showmore_3').innerHTML ='<a>Even More Skills</a>';
                }
                else 
                {
                    more_3.style.display = "block";
                    document.getElementById('showmore_3').innerHTML ='<a>Show Less</a>';
                }
            }
    function showmore4()
            {
                var more_4 = document.getElementById("learnmore_4");
                if (more_4.style.display == "block") 
                {
                    more_4.style.display = "none";
                    document.getElementById('showmore_4').innerHTML ='<a>Even More Accomplishments</a>';
                }
                else 
                {
                    more_4.style.display = "block";
                    document.getElementById('showmore_4').innerHTML ='<a>Show Less</a>';
                }
            }

取出函数中改变(变量)的代码位,然后组合功能并将变量传递给函数以插入。

function showmore(id, more, less) {
    var more = document.getElementById('learnmore_'+id);
    if(more.style.display == "block") {
        more.style.display = "none";
        document.getElementById('showmore_'+id).innerHTML ='<a>'+more+'</a>';
    } else {
        more.style.display = "block";
        document.getElementById('showmore_'+id).innerHTML ='<a>'+less+'</a>';
    }
}

然后像这样使用:

showmore(1, 'Even more accomplishments', 'Show less');
 function showmore(id, moreMessage, lessMessage)
        {
            var more = document.getElementById('more'+id);
            if (more.style.display == "block") 
            {
                more.style.display = "none";
                document.getElementById('showmore_'+id).innerHTML ='<a>'+moreMessage+'</a>';
            }
            else 
            {
                more.style.display = "block";
                document.getElementById('showmore_'+id,).innerHTML ='<a>'+lessMessage+'</a>';
            }
        }

我不测试它

function showmore(number,moreMessage,lessMessage)
{
    var more = document.getElementById("learnmore_"+number);
    if (more.style.display == "block") 
    {
        more.style.display = "none";
        document.getElementById('showmore_'+number).innerHTML ='<a>'+moreMessage+'</a>';
    }
    else 
    {
        more.style.display = "block";
        document.getElementById('showmore_'+number).innerHTML ='<a>'+lessMessage+'</a>';
    }
}