javascript - 如何从不同的 HTML 文件调用 JavaScript 函数?

标签 javascript html css

我正在尝试从单独的 HTML 文件获取链接以显示特定的自动 JavaScript 隐藏元素。该页面显示 8 个单独的按钮,单击这些按钮时会显示一个隐藏的 div 元素。

JavaScipt函数代码:

    function tr() {
        var x = document.getElementById("tr");
        if (x.style.display === "block") {
            x.style.display = "none";
        } else {
            x.style.display = "block";
        }
    }

我再次尝试从单独的 HTML 文件中调用此函数。

谢谢!

编辑:是的,抱歉,我应该提到我对 JavaScript 非常缺乏经验。现在,当我将它变成一个对象时,似乎该函数仍然没有被调用。我需要包含什么内容才能使该对象成为全局对象吗?

var name = {
    a : function tr() {
        (...)
    }
}

我如何调用它:

<button onclick="name.a()" class="button">

最佳答案

使用以下命令,您可以从不同的 HTML 文件调用 JavaScript 函数:

<script src="demo.js"></script>

这里的 demo.js 是你的 javaScript 文件名。 并在此代码中添加 id="tr"onclick="tr()"

<button onclick="tr()" class="button" id="tr">demo btn</button>

示例:

function tr() {
    var x = document.getElementById("tr");
    alert("function is call");

    // if (x.style.display === "block") {
    //     x.style.display = "none";
    // } else {
    //     x.style.display = "block";
    // }
}
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button onclick="tr()" class="button" id="tr">demo btn</button>
    <script src="demo.js"></script>
</body>

</html>

关于javascript - 如何从不同的 HTML 文件调用 JavaScript 函数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61315377/

相关文章:

Javascript:查找文本文档中所有出现的单词

javascript - 放置div1和div2 onclick事件的内容

html - 为什么我使用相同的十六进制值在不同的浏览器中得到不同的颜色?

javascript - 永远不要同时显示两个 div

css - 在 IE9-10 中压缩 SVG 的背景大小

php - Onsubmit javascript 将值发送到 php 并返回值

javascript - 悬停时使图像从暗变亮

jquery - 如何在输入字母时向右移动一个 div(如输入插入符号)?

CSS:一 block 不同颜色的背景?

css - 卡体内容溢出包含卡