이 글의 예시에서는 클릭 후 텍스트를 표시하도록 버튼을 변경하기 위해 자바스크립트를 사용하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 구현 방법은 다음과 같습니다.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>显示一些按钮，如果点击了，
当前点击的按钮文本变为“点了”，其他按钮文本变为“没点”</title>
<script type="text/javascript">
//为所有按钮动态添加事件
function IniButtonEvent() {
var Items = document.getElementsByTagName("input");
for (var i = 0; i < Items.length; i++) {
var objTmp = Items[i];
if (objTmp.type == "button") {
objTmp.onclick = ButtonClick;
}
}
}
function ButtonClick() {
var Items = document.getElementsByTagName("input");
for (var i = 0; i < Items.length; i++) {
var objTmp = Items[i];
if (objTmp.type == "button") {
//判断是否是按钮
//window.event.srcElement触发当前事件的元素
//用来判断是否是当前单击的按钮
if (objTmp == window.event.srcElement) {
objTmp.value = "点了";
}
else {
objTmp.value = "没点";
}
}
}
}
</script>
</head>
<body onload="IniButtonEvent()">
显示一些按钮，如果点击了，当前点击的按钮文本变为“点了”，
其他按钮文本变为“没点”<br />
<input type="button" value="没点" />
<input type="button" value="没点" />
<input type="button" value="没点" />
<input type="button" value="没点" />
<input type="button" value="没点" />
</body>
</html>이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
