检测具有 href 属性的“A”标记，该属性等于当前页面的 URL

detect an 'a' tag with href attribute that equals the url of the current page

本文关键字：属性 URL 当前页 href 检测 标记      更新时间：2023-09-26

我的任务包含几个步骤：

  1. 隐藏页面中的所有链接
  2. 检测具有等于当前页面 URL 的 href 属性的链接元素
  3. 显示此元素邻居

我正在使用的html是这样的：

<div class="alllinkswrap">
  <a class="allproductsurls" href="blabla1.com">1</a>
  <a class="allproductsurls" href="blabla2.com">2</a>
  <a class="allproductsurls" href="blabla3.com">3</a>
  <a class="allproductsurls" href="blabla4.com">4</a>
  <a class="allproductsurls" href="blabla5.com">5</a>
</div>

我试图用display: none隐藏所有链接元素，我只想显示当前链接顶部和底部的 2 个链接。我使用的jQuery代码：

  $(docment).ready(function(){
  var thispageurl = window.location.href;
   $(".alllinkswrap").children().each(function(){
    if (this.href.indexOf(thispageurl)) 
     {
       $(this).next().show();
       $(this).prev().show();
       }
   });
  });

我猜错误出在$(this).next的某个地方等等。但对jQuery来说仍然是新的。你能发现问题吗？

原始

你的 indexOf（...） 需要检查不是 -1，当in this.href找不到 thispageurl 时，它将返回 -1。或者您可以检查它是否等于 0，因为当找到目标链接时，应该在索引 0 处找到它。

更新

如果你确实想检查当前 URL 和目标 href 的相等性，我们需要使用 Javascript 中的==或===比较。这是因为当页面位于子会话中或您在域中时，我们会遇到问题。例如：

如果 thispageurl = http://url.com 且 this.href = http://url.com/page1.html则使用 this.href.indexOf(thispageurl) 将返回 0，但这不正确。如果我们在这种情况下反转 for thispageurl.indexOf(this.href) 的索引，.indexOf() 返回 -1。同样，如果我们分别将thispageurl和this.href翻转到http://url.com/page1.html和http://url.com，则会遇到类似的情况，具体取决于我们获取索引的内容。

所以我更新了以下代码以检查字符串值的相等性。

var thispageurl = window.location.href;
$(".alllinkswrap").children().each(function(){$(this).hide()})
$(".alllinkswrap").children().each(function(){
  if (this.href === thispageurl) 
  {
    $(this).next().show();
    $(this).prev().show();
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="alllinkswrap">
  <a class="allproductsurls" href="blabla1.com">1</a>
  <a class="allproductsurls" href="blabla2.com">2</a>
  <a class="allproductsurls" href="http://stacksnippets.net/js">3</a>
  <a class="allproductsurls" href="blabla4.com">4</a>
  <a class="allproductsurls" href="blabla5.com">5</a>
</div>

相关文章：