twitter-bootstrap - Firefox 和 Firebug : how to inspect dynamically generated Bootstrap tooltip?

Question

我想在 Bootstrap (3.x) 工具提示中添加一个 CSS 类，但它似乎不起作用。所以我想使用 Firebug 来检查工具提示内容。但是，当我将鼠标移动到 Firebug 区域时，动态生成的工具提示消失了。

如何检查动态生成的 Bootstrap 工具提示？

这里是 jsfiddle link .

<label>
Some Text 
<a href="#" data-toggle="tooltip" title="Tooltip goes here!">?</a>
</label>

$(function() { 
    $('[data-toggle="tooltip"]').tooltip({
        'animation': true,
        'placement': 'top' 
    });
});

谢谢!

Answer 1

启用Script panel

重新加载页面

检查 <label>包含 Some Text? 的元素

右键单击元素并从上下文菜单中选择“添加或删除子元素时中断”

将鼠标移到问号上
=> 脚本执行将停止，您将看到显示工具提示元素的提示。

按下 Step Over 按钮 ( ) 或按下 F10 一次，元素被添加到 DOM

切换到HTML panel

=> 在那里你会看到 <div>包含工具提示，您将能够检查其样式。