Javascript 按类为窗口和属性url选择层次结构元素

你好，我是相关标签的初学者

我用作参考：

我有这个HTML：

<div class="pager">
    <br />
    <div class="myjsp-prev-next" style="text-align:inherit;">
        <span class="myjsp-prev"><a href="{url}">Prev</a></span>
        <span class="myjsp-next"><a href="{url}">Next</a></span>
    </div>
</div>
<br />

我正在阅读JQUERY的API，并希望尝试使用querySelector选择该类的元素，然后转到下一个或上一个url

我正在阅读JQUERY的层次结构页面，我不确定到底出了什么问题。提前谢谢

编辑： 我试着加上：

<script     src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script type="text/javascript">

$(function() {
$(document).keyup(function(e) {
switch (e.keyCode) {
  case 37:
var x = document.querySelectorAll(".myjsp-prev a")[0];
var href = x.getAttribute('href');
    window.location = x.attr('href');
    break;
  case 39:
var y = document.querySelectorAll(".myjsp-next a")[0];
var href = y.getAttribute('href');
    window.location = y.attr('href');
    break;
    }
  });
});

</script>

目前，我可以使用箭头键转到上一个，但无法转到下一个

我试图找到一种方法来计算选项选择器中有多少个元素，然后将这些url存储到附加了start=1、start=2等的数组中，直到选项选择器中可以选择的url的最大数量

编辑：

Nvm我想出来了：

---

在第二种情况下，我使用了x而不是y…

您可以像这样使用javascript查询选择器

var x = document.querySelectorAll(".myjsp-prev a")[0];
var href = x.getAttribute('href');

$（函数（）{
$（文档）.keyup（函数（e）{
开关（如钥匙代码）{
案例37：
var x=document.querySelectorAll（“.myjsp prev a”）[0]；
log（x.getAttribute（'href'）；
//window.location=x.attr（'href'）；
打破
案例39：
var y=document.querySelectorAll（'.myjsp next a'）[0]；
console.log（y.getAttribute（'href'）；
//window.location=y.attr（'href'）；
打破
}
});
});




您好，先生，谢谢您的帮助，我尝试了代码，但遇到了问题，我不能完全确定我是否丢失了一个库或者我做错了什么。请参阅编辑后的文章。
<div id="mjsp-menu-select" style="float:right">
<select onchange="navigateTo(this, 'window');">
<option value="/example/example">Page 1</option>
<option value="/example/example?start=1" selected="selected">2</option>
<option value="/example/example?start=2">3</option>
<option value="/example/example?start=3">4</option>
<option value="/example/example?start=4">5</option>
<option value="/example/example?start=5">6</option>
<option value="/example/example?start=6">7</option>
<option value="/example/example?showall=1"> All Pages</option>
</select>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="pager">
  <br />
  <div class="myjsp-prev-next" style="text-align:inherit;">
    <span class="myjsp-prev"><a href="{url-prev}">Prev</a></span> 
    <span class="myjsp-next"><a href="{url-next}">Next</a></span>
  </div>
</div>
<br />

$(function() {


document.querySelectorAll("#mjsp-menu-select option").length;

  $(document).keyup(function(e) {
    switch (e.keyCode) {
      case 37:
        var x = document.querySelectorAll(".myjsp-prev a")[0];
        var href = x.getAttribute('href');
        window.location = x;
        break;
      case 39:
        var y = document.querySelectorAll('.myjsp-next a')[0];
       var href = x.getAttribute('href');
        window.location = y;
        break;
    }
  });
});

var x = document.querySelectorAll(".myjsp-prev a")[0];
var href = x.getAttribute('href');