javascript - 查看附加到 html 按钮的代码

Question

我正在尝试查看当 this page 左上角的展开所有主题/折叠所有主题按钮时执行的代码已切换。我查看了源代码并在 Chrome 检查器中进行了挖掘，但我还没有找到它。它没有列出任何监听器。来源非常简单，所以我认为它应该很简单。如果有人能指出我正确的方向，我将不胜感激。

Answer 1

按钮的ID是tglTopicBtn

代码是:

$("#tglTopicBtn").button({
    icons: {primary: "ui-icon-carat-1-s"}
}).click(function() {
    lastClickedSection = undefined;
    var options;
    if ($(this).text() === "Expand All Topics") {
        options = {
            label: "Collapse All Topics",
            icons: {primary: "ui-icon-carat-1-n"}
        };
        showSections();
    }
    else {
        options = {
            label: "Expand All Topics",
            icons: {primary: "ui-icon-carat-1-s"}
        };
        hideSections();
    }
    $(this).button("option", options);
    updateSelectedSection();
    return false;
});

我在F12/source/js/basic.js下找到了它

以下是将来使用 jQuery 访问时查找源代码的步骤:

• 如果您正在寻找与 div 关联的 js 代码在网络中，选择 View page source在右键单击选项中。

• 如果该 div 中有一些文本，请使用 crtl+f 查找它。在这种情况下，我发现 <button id="tglTopicBtn">Expand All Topics</button>

• 转到F12/Source ，并查找 JScript 代码。使用 tglTopicBtn 查找 id(ctrl+f 此处)在具有合理名称的文件中。文件如bootstrap.js或jquery.js通常都是下载的。在这种情况下，basic.js和hooks.js看起来像是该网站的特定代码。