Javascript 动态生成引导工具提示

我有一个带有文本的页面，文本中的一些单词可以动态更改。这些单词有一个元素，应该有一个工具提示。当用户将单词悬停（或者我猜在触摸设备上单击它）时，应该使用

generateSpecialMarkupElement（$（element）.text（））

生成工具提示。将HTML呈现给DOM后，必须调用另一个JavaScript函数

replaceMarkupHTML（）

不幸的是，我无法控制这些函数

现在我想知道在引导中是否有一种简单的方法来完成这项工作。例如，运行第一个函数的

before

事件和调用第二个函数的

before

事件

下面是一个简单的示例文本和函数的简化版本：

那么，有没有一种引导方式可以钩住/拦截这种东西呢？或者有没有其他简单的方法

编辑：我刚有个主意。当bootstrap显示工具提示时，它似乎向DOM中注入了一个元素。有趣的部分是包含类“tooltipinner”的容器。因此，我尝试在主体上侦听与要注入的“.tooltip inner”匹配的新元素，每当发生这种情况时，我尝试对其进行操作：

$('body').on('DOMNodeInserted', '.tooltip-inner', function () {
      var el = $(this)
      el.html("") // empty the tooltip element
      el.append(generateSpecialMarkupElement(el.text())) // insert the generated markup element
      replaceMarkupHTML() // replace the markup element with normal html
});

不幸的是，它不起作用。它只是抛出了一百万个错误，当我尝试它时，网站冻结了

编辑2： 多亏了克里斯·巴尔，我更接近了：

---

但是工具提示并不总是显示，而且工具提示的位置似乎有点错误（显示在单词的顶部，而不是在/over/down/…）旁边）。

您可能需要查看文档中列出的工具提示事件：

---

您可以运行一个函数：在显示之前、显示之后、隐藏之前、隐藏之后，以及在将元素插入DOM时。

我真的不知道这是否是您想要的，但是。。。这不是。。。一点也不。有时候好像挺管用的。但这似乎很不可靠。你知道我做错了什么吗？我想问题是你生成了一个工具提示，然后它试图在显示之前定位自己，然后就在这之前，你在插件不知道的情况下手动切换工具提示中的HTML，并且位置不会更新。你所做的技术上是可行的，但它非常粗糙，特别是因为工具提示不能以这种方式正确定位。此外，您的演示似乎正在使用引导版本2.3.2，但版本3.3.7是最新版本-这是故意的吗？将演示更新为引导版本3.3.7允许使用

inserted.bs.tooltip

事件，这将允许在工具提示呈现和定位之前进行所需的更改。这里是你的演示清理了一点，工作的预期（但仍然非常黑客！），和tiwh更新引导。不，那不是故意的。非常感谢你，它似乎工作得很好！

$('.elements-with-tooltips').on('show.bs.tooltip', function () {
  // do something…
})