我正在尝试用JS编写这个简单的面向对象程序，有人可以帮我写吗？ http://rb.gy/cnonlb https://rb.gy/cnonlb 我理想地想把它写成一堂课 我尝试制作这个节目。
代码如下： http://rb.gy/cnonlb https://rb.gy/cnonlb 我想把这个写成课堂。 我希望程序具有三种方法： 显示名称 显示姓氏 并打印
here 's html code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<form>
<label>Imię: <input id="name" /></label>
<label>Nazwisko: <input id="surname" /></label>
<button id="addData">Dodaj</button>
</form>
<script src="script.js"></script>
</body>
</html>
here's js code functions and trying in oop by class
function showName() {
// console.log(`${nameInput.value}`);
// }
// function showSurname() {
// console.log(`${surnameInput.value}`);
// }
// function print(e) {
// e.preventDefault();
// console.log(`${nameInput.value} ${surnameInput.value}`);
// }
// btn.addEventListener("click", print);
// a poniżej próby obiektowo
class Person {
constructor() {
this.nameInput = document.querySelector("#name");
this.surnameInput = document.querySelector("#surname");
this.btn = document.querySelector("#addData");
this.btn.addEventListener("click", this.showName);
}
showName(e) {
e.preventDefault();
console.log(`${this.nameInput.value}`);
}
showSurname() {
console.log(`${surnameInput.value}`);
}
}