Кнопки навигации JavaScript (предыдущий следующий) на основе неупорядоченного списка HTML

Question

У меня есть страница с именем index.php, которая содержит список div вроде этого:

<div id="links">
     <ul>
        <li><a href="example1.php">example1</a></li>
        <li><a href="example2.php">example2</a></li>
        <li><a href="example3.php">example3</a></li>
        ......
        <li><a href="exampleN.php">exampleN</a></li>
    </ul>
</div>

, который является списком страниц моего сайта, показанным на странице index.php.Я хочу добавить меню «prev | home | next» на каждую страницу сайта (example1, example2, example3, ..., exampleN), где «prev» возвращает меня к предыдущему и следующему примеру,то есть, если я смотрю пример № 3 (страница example3.php), предыдущий переводит меня на пример № 2 (страница example2.php) и так далее.

Я хотел бы использовать сценарий, который не основан нафиксированный массив (определяемый пользователем), потому что я не хочу обновлять этот массив каждый раз, когда новая страница добавляется в список index.php.

Я думал о такой функции: предположим, мы 'Что касается example2.php

function blahblah(){
    1) get the link list using DOM from index.php (using an array)
    2) search for "example2.php" in the href value of each element in the list, to get the index of the array: in this case, "example2.php" is the 2nd link of index.php, so the array index will be 1 (i.e. alert(linkList[1].href) will print "example2.php")
    3) once we know the index, previous page index will be "index-1" and next page will be "index+1"
}

Что касается получения списка (1-й пункт моего псевдокода), я не знаю, как получить доступ к другим страницам (в том же домене), используя элементы DOM ...document ("page"). getElementById ('links') существует без необходимости использования iframe?

Я на правильном пути?Или совершенно не так?Любая помощь, идея или совет приветствуются.Спасибо, С наилучшими пожеланиями

Answer 1

Нет, вы не можете легко получить доступ к другим файлам, но если список div находится на каждой странице, тогда очень легко добавить навигацию

window.onload=function() {
  var navLinks = document.getElementById("links").getElementsByTagName('a');
  var loc = location.href;
  var href,html="";
  for (var i=0;i<navLinks.length;i++) {
    href=navLinks[i].href;
    if (loc.indexOf(href)!=-1) {
      if (i==0) html+='prev ';
      else html +='<a href="'+navLinks[i-1].href'">prev</a>' 
      if (i==navLinks.length-1) html+=' next ';
      else html +='<a href="'+navLinks[i+1].href'">next</a>' 
    }
  }
  if (html) document.getElementById("links").appendChild(html);
}