Javascript 当鼠标悬停时，如何向网页上的单词添加弹出（工具提示）定义？

我的250页的网站有一个词汇表，里面有很多单词和它们的定义。我想找到一种方法，让词汇表中的单词在出现在网站文本中时突出显示，并在悬停时显示单词定义的“工具提示”气泡。我的网站页面都是html——我没有使用CMS

我想我需要使用javascript来实现这一点。我看了又看，发现了可以突出显示特定文本的javascript函数（即将其包装在span标记中），但我不知道如何让它在一个单词数组中迭代并包含它们的定义，我不确定这会占用多少资源

---

是否有一个词汇表类型的程序存在，可以为我工作，而不必手动更新整个网站上每个单词的每个实例？还是有一个相当简单的方法来实现这一点？谢谢

这可以使用JQuery完成，并将术语表作为页面上的隐藏div，如果需要，可以使用AJAX加载

$（“#词汇表h2”）。每个（函数（索引）{
//获取单词及其定义。
var word=$（this.text（）；
var def=$（“#词汇表”）.find（“p”）[index].innerHTML；
//使用鼠标悬停def更新内容页中该单词的所有实例。
var contentHTML=$（“#content”）.html（）；
contentHTML=contentHTML.replace（新的RegExp（单词“g”），“”+word+“”）；
$（“#content”）.html（contentHTML）；
});

威尔喜欢和吉姆一起出去玩。
意志
这是威尔的def

吉姆
这是吉姆的def

您可以发布一些术语表中的代码吗？此时术语表只是一个文本（html）文档。页面上的单词。我对结构更感兴趣。比如你使用的是定义列表、段落等吗？它只是术语定义。然而，这很容易改变。我很乐意将这些术语和定义放入xml电子表格中，或者将它们组织到任何需要的数组中，以使上述内容正常工作。也许只需使用纯且语义正确的HTML
WHO
。浏览器应该自动显示工具提示。这很好，唯一的问题是，因为它会传递每个术语表术语，如果定义中存在另一个术语，它会将标记嵌套在前一个标记的标题字段中。例如，如果你有“这是will的def，它与Jim的不同，你会遇到问题。结果会是这样：Jim的.”>will喜欢和Jim一起玩。