利用JS实现a标签“指定页面跳转”和“连续查询跳转”

被迫做前端篇：“不会没关系，是你的认知限制了你”

指定页面跳转：

a标签同时含有onclick和href优先执行onlick，如果js不做限制的话，onlick执行完成后，将继续跳转href。

<!-- HTML-->
<a onclick="DoingURL()" href="/category/1/">点击跳转</a>

<script>
function DoingURL(){
    window.location.href="https://www.baidu.com/";
    window.event.returnValue=false; //不执行原a标签href链接
    return;
}
</script>

连续查询跳转：

连续查询要做的是：根据当前页面url所带的参数，来判定点击跳转后产生的新url参数。

比如当前页面url：https://www.baidu.com/

点击跳转后：https://www.baidu.com/category/1/

比如当前页面url：https://www.baidu.com/country/2/

点击跳转后：https://www.baidu.com/country/2/category/1/

<!-- HTML-->
<!-- DoingURL(href)能够将新的url传入js -->
<a onclick="DoingURL(href)" href="/category/1/">点击跳转</a>

<script>
function DoingURL(href){
    var datahref=href.split("/");     //新url用‘/’进行分解
    var url = window.location.href;   //当前页面url 
    var dataurl=url.split("/");       //当前页面url进行分解
    var country=0,category=0;         //country和category带的参数

    for(var i=2;i<datahref.length;i++)    //查询新url参数
    {
         if(datahref[i] == "category")
             category=datahref[i+1];
    }
    for(var i=2;i<dataurl.length;i++)    //查询当前页面url参数
    {
        if(dataurl[i]=="country")
            country=dataurl[i+1];
    }
    if(country!=0)
    {
        window.location.href="/country/"+country+"/category/"+category+"/";
        window.event.returnValue=false;
        return;
    }
    else
    {
        return;    //发现当前页面不带有country，可直接跳转a标签中的href
    }
}
</script>