我有 4 个具有相同 ID 的按钮(用于 CSS 目的)我想在单击按钮后突出显示该按钮。通过传递 id 它工作正常，但我想传递按钮的名称(唯一名称)。当我尝试 getElementByNames() 时，它不起作用。 这是具有不同 ID 的代码，我希望它用于不同的名称
<html>
<head>
<style type="text/css">
</style>
<script type="text/javascript">
var buttonClicked = null;
function highlight(id)
{
if(buttonClicked != null)
{
buttonClicked.style.background = "grey";
buttonClicked.style.color="black";
}
buttonClicked = document.getElementById(id);
buttonClicked.style.background = "blue";
buttonClicked.style.color="white";
}
</script>
</HEAD>
<BODY>
<table width="100%" cellspacing="0" cellpadding="3px">
<tr>
<td>
<input type="button" value="BUTTON" id="select1" name="select1" onclick="highlight('select1')">
</td>
<td>
<input type="button" value="BUTTON" id="select2" name="select2" onclick="highlight('select2')">
</td>
<td>
<input type="button" value="BUTTON" id="select3" name="select3" onclick="highlight('select3')">
</td>
<td>
<input type="button" value="BUTTON" id="select4" name="select4" onclick="highlight('select4')">
</td>
</tr>
</table>
</BODY>
</HTML>
最佳答案
您的问题有点不清楚 - 您说“我有 4 个具有相同 ID 的按钮”，但在您的代码中它们具有不同的 ID。如果您确实“有 4 个具有相同 ID 的按钮(用于 CSS 目的)”，那么:
如果要将 CSS 样式应用于多个元素，则应使用类而不是 ID。然后您可以为您的按钮使用唯一 ID，并且您现有的代码将运行良好。
<style>
.myclass {
color: red; // CSS rules for all these buttons
}
</style>
<input type="button" id="select1" class="myclass" ...
<input type="button" id="select2" class="myclass" ...
关于javascript - 如何在不传递按钮 ID 的情况下突出显示单击的按钮？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31020474/