获取不带 id 的 HTML 中特定段落的链接

Question

我想将我的读者引导到第三方HTML 网页中的特定位置。感兴趣的段落如下所示：

<div>
<h1>qwerty</h1>
<p>blah blah</p>
</div>

如您所见，没有一个元素有ids（所以这个http://webpage/#id 不起作用）。但是，<h1> 标记中的单词是唯一的，在文档的其他任何地方都找不到。有没有办法提供一个链接，将用户直接带到网页上的那个位置？

Answer 1

完成这项工作的更好方法是在元素中使用id 属性。

但是您可以使用 jquery :contains 选择器来查找包含 hash 的元素。然后获取元素的顶部位置并将窗口滚动到它的位置。

window.location.hash = "id";

var hash = window.location.hash.replace("#", "");
var scrollTop = $("h1:contains(" + hash + ")").offset().top;

window.scrollTo(0, scrollTop);

div {
    height: 300px;
}

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

Answer 2

您不能仅链接到页面中的某些文本，因此如果您不控制该站点，则无法链接。

据我所知，您可以做的最接近的事情是使用citebite，它会创建一个插入了 id 的新页面，以便将您带到该部分。但是，根据我的经验，它很受欢迎。