读取浏览器导航栏并基于它生成导航链接



我想知道是否可以拥有可以读取地址栏的脚本;

示例(不是实际链接(:http://www.example.net/page-2011

并将页面-2011零件转换为

« <a href="/page-2010">Previous</a>|<a href="/page-2012">Next</a> »

因此,而不是必须进行3000个导航链接,而只是自动生成它。作为另一个挑战,侧边栏是一个完全独立的页面,当您加载页面时缺乏更好的术语,该页面在"编译时间"上加载。http://www.example.net/nav:side这是每次加载页面时都会拉动的实际页面。

window.Location仅读取属性返回一个位置对象,其中包含有关文档当前位置的信息。

javaScript窗口。location

var url1 = window.location;            //returns the url as an object
var url2 = window.location.href;       //returns the url string
var url3 = window.location.pathname;   //returns the url path

split((方法通过将字符串分隔为子字符串将字符串对象拆分为字符串。

javascript .split((

拥有URL后,可以使用.split("-")。在您的情况下,如果每个页面都设置为/page-2,则将返回对象{"page","2"}

var pathSplit = url3.split("-");       //returns {"page","2"} from page-2

slice((方法提取字符串的一部分并返回新字符串。

javascript .slice((

如果您的路径以/结束,则可以使用.slice((修剪最后一个字符。

var pathSplice = url3.slice(0,-1);     //returns /page-2 from /page-2/
var pathSplit = pathSplice.split("-"); //returns {"/page","2"} from /page-2

现在,您可以通过访问索引1pathSplit对象来获取页码2,然后将页码2作为整数分析,然后执行所需的方程式以接收所需的页面。

>
var pageNum = parseInt(pathSplit[1]);
var prevPage = 0,
    nextPage = 0;
if(isNaN(pageNum) === false){
    prevPage = pageNum - 1;    //returns 1 from 2
    nextPage = pageNum + 1;    //returns 3 from 2
}

[element.setAttribute((]在指定元素上设置属性的值。如果属性已经存在,则该值已更新;否则,将添加带有指定名称和值的新属性。

javascript .setAttribute((

最后,您可以设置锚点<a></a>的值,例如So

var prevLink = document.querySelector(".prev-link");
var nextLink = document.querySelector(".next-link");
prevLink.setAttribute("href", "/page-" + prevPage.toString());
nextLink.setAttribute("href", "/page-" + nextPage.toString());

注意:确保已将类或ID分配给上一页和下一页链接。

相关内容

最新更新