如何在HTML中访问JavaScript类？如何调用类中的gettingValue方法？

嘿，这事儿其实挺简单的，我来给你一步步说清楚～

首先得确认你的javascript.js已经正确引入到functioncall.html里了，比如在页面的<head>或者<body>末尾加上：

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

接下来分两种常用的方式实现按钮点击调用方法：

方式一：直接在HTML按钮中写onclick事件 #

因为gettingValue是实例方法（需要先创建类的实例才能调用），所以我们要先实例化BokunoHero，再调用方法。修改按钮标签如下：

<button id="clickmeplease" onclick="const myHero = new BokunoHero(); myHero.gettingValue();">点击调用方法</button>

如果你的gettingValue方法需要接收参数，直接在括号里传就行，比如myHero.gettingValue('我的英雄')。

方式二：JS事件绑定（更推荐，解耦HTML和JS） #

这种方式把逻辑放在JS里，代码结构更清晰。在functioncall.html中添加一个<script>标签，或者在javascript.js末尾添加以下代码：

// 等待DOM完全加载后再绑定事件，避免找不到按钮元素
document.addEventListener('DOMContentLoaded', () => {
  // 获取按钮元素
  const btn = document.getElementById('clickmeplease');
  // 绑定点击事件
  btn.addEventListener('click', () => {
    // 创建BokunoHero实例
    const heroInstance = new BokunoHero();
    // 调用gettingValue方法
    heroInstance.gettingValue();
  });
});

小提示 #

如果gettingValue是静态方法（定义时用static关键字），那不需要实例化，直接调用BokunoHero.gettingValue()就可以啦，但从你描述的“类包含gettingValue方法”来看，默认是实例方法，所以上面的写法没问题。

内容的提问来源于stack exchange，提问作者Appem