Javascript 在网页中找不到由URL段标识的HTML节

当在网页上找不到url片段标识的部分时，如何通知用户

例如：

网站1包含：

<a href="/website2#foo"> bring me to the foo section of website2 </a>

<div id="foo"> I'm the foo section </div>

网站2包含：

<a href="/website2#foo"> bring me to the foo section of website2 </a>

<div id="foo"> I'm the foo section </div>

我是foo组

因此，如果我单击链接，div的标识符不是“foo”，而是“bar”，则网页会显示类似“foo section not found”的警报

上下文：我在一个html页面上公开了一个API的JSON响应，我希望JSON的属性链接到一个文档页面。如果未找到描述该属性的部分，则应发出警报，建议更新文档

更新：如果可能，不使用javascript框架

谢谢你在使用jQuery吗？ 使用html或css无法做到这一点，但使用jQuery可以非常轻松地做到这一点，如下所示：

   $('.navigation a').on("click", function(){
      //This gets the href and splits it on "#". Grabs the value after "#"
      //Make sure to only have 1 # in a link
      var idToFind = $(this).attr("href").split("#")[1];

      //Check if a div with this ID exists
      if($('#'+idToFind).length > 0){
       //it has been found, you could turn the scrolling to the section into a neat animation here, if you want
      }
      else{
        //It has not found it. Alert.
        alert('"' + idToFind + '" section not found');
      }

  });

编辑 下面是一个普通的js解决方案：

html:

您正在使用jQuery吗？ 使用html或css无法做到这一点，但使用jQuery可以非常轻松地做到这一点，如下所示：

   $('.navigation a').on("click", function(){
      //This gets the href and splits it on "#". Grabs the value after "#"
      //Make sure to only have 1 # in a link
      var idToFind = $(this).attr("href").split("#")[1];

      //Check if a div with this ID exists
      if($('#'+idToFind).length > 0){
       //it has been found, you could turn the scrolling to the section into a neat animation here, if you want
      }
      else{
        //It has not found it. Alert.
        alert('"' + idToFind + '" section not found');
      }

  });

编辑 下面是一个普通的js解决方案：

html:

---

这应该能奏效

在website2的“onLoad”上，我检查url是否包含一个段，然后使用getElementById（段）在文档中查找该Id

你好，世界！
函数myFunction（）{
var段；
if（window.location.hash）{
段=window.location.hash.substring（1）；
if（document.getElementById（段）==null）{
警报（“未找到id为“+段+”的html元素”）；
}
}
}

这应该可以做到

在website2的“onLoad”上，我检查url是否包含一个段，然后使用getElementById（段）在文档中查找该Id

你好，世界！
函数myFunction（）{
var段；
if（window.location.hash）{
段=window.location.hash.substring（1）；
if（document.getElementById（段）==null）{
警报（“未找到id为“+段+”的html元素”）；
}
}
}

但是vanilla javascript可以吗？我认为正确的方法可以是加载website2检查（window.location.hash）window.location.hash.substring（1），然后使用getElementById..@GaSacchi查找该Id。这完全正确。但是vanilla javascript可以吗？我认为正确的方法可以是加载website2检查（window.location.hash）window.location.hash.substring（1），然后使用getElementById..@GaSacchi查找该Id。这完全正确。不起作用。该部分位于另一页上

onclick

handler不会这样做，检查必须在另一页上。哦，对不起，那部分我一点也不清楚。在这种情况下，您只需将我从

a

中创建的变量切换到url标签，然后删除

a onClick=

。相反，在

正文中添加`onLoad=“function（）；”。然而，我现在看到其他人以这种方式回答了问题，所以我猜那个人现在已经为你回答了你的问题。编辑：哦，那是你哈哈。我不是OP。OP回答了他自己的问题。行不通。该部分位于另一页上
onclick
handler不会这样做，检查必须在另一页上。哦，对不起，那部分我一点也不清楚。在这种情况下，您只需将我从
a
中创建的变量切换到url标签，然后删除
a onClick=
。相反，在
正文中添加`onLoad=“function（）；”。然而，我现在看到其他人以这种方式回答了问题，所以我猜那个人现在已经为你回答了你的问题。编辑：哦，那是你哈哈。我不是OP。OP回答了他自己的问题。第二个
if
可以移动到第一个，在没有散列的情况下保存一张支票。另外，您是否希望在出现
#
但之后没有任何内容时显示警报？（即，
段
为空）在我的例子中，是的，因为这些ID将自动生成，因此如果我们链接到一个属性，并且该段为空，我们需要知道出了什么问题。是的，如果在第一个里面可以移动第二个。Thanksnd
if
可以移动到第一个字段，以便在没有散列的情况下保存支票。另外，您是否希望在出现
#
但之后没有任何内容时显示警报？（即，
段
为空）在我的例子中，是的，因为这些ID将自动生成，因此如果我们链接到一个属性，并且该段为空，我们需要知道出了什么问题。是的，如果在第一个里面可以移动第二个。谢谢