我对JavaScript是新手，并且正在尝试在我的网页上编码一系列功能以更改页面的整体亮度。我在页面中编码了3个按钮，负责增加，降低和重置身体的亮度。然后，我已经编码了一些JavaScript，这些JavaScript应该在单击每个按钮时将亮度提高/降低10％。我已经完成了以下操作：
var $ = function (id) {
return document.getElementById(id);
};
function modifyBrightness(val) {
var brightness = 1.0;
brightness = brightness + val;
brightness = parseInt(brightness, 10);
$("body_id").style.filter = "brightness(brightness)";
return brightness;
}
function resetBrightness() {
$("body_id").style.filter = "brightness(1.00)";
}
$("decrease_brightness").onclick = modifyBrightness(-0.1);
$("increase_brightness").onclick = modifyBrightness(0.1);
$("reset_brightness").onclick = resetBrightness();#body_id{
height: 100px;
background-color: blue;
} <body id="body_id>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tincidunt pharetra dui, non efficitur mauris scelerisque sed. Donec auctor ut sem vitae bibendum. Aliquam dignissim aliquet augue et condimentum. Aliquam non dui velit. Aenean egestas ligula eget urna malesuada imperdiet. Vivamus vel velit dapibus, sollicitudin dolor at, elementum quam. Aenean eu libero vel velit faucibus convallis. Nullam et velit a ipsum sagittis malesuada. <p>
<body>
<form id="brightness_change_form">
<label for="decrease_brightness" id="change_brightness_label">Change Brightness:</label>
<input type="button" id="decrease_brightness" value="Decrease Page Brightness">
<input type="button" id="increase_brightness" value="Increase Page Brightness">
<input type="button" id="reset_brightness" value="Reset Page Brightness">
</form>但是，我根本不太了解我的JavaScript中有什么问题。非常感谢任何建议。
正如尼古拉斯（Nicholas）指出的那样，您错过了身体ID上的关闭报价，这就是为什么您会遇到语法错误。
将<body id="body_id>更改为<body id="body_id">。
var current = 50;
const $ = (id) => document.getElementById(id);
function modifyBrightness(val) {
current += val;
//$("body_id").style.backgroundColor = `hsl(240, 100%, ${current}%)`;
$("body_id").style.filter = `brightness(${current}%)`;
}
$("decrease_brightness").addEventListener('click', () => {
modifyBrightness(-10);
});
$("increase_brightness").addEventListener('click', () => {
modifyBrightness(10);
});
$("reset_brightness").addEventListener('click', () => {
modifyBrightness(50);
});#body_id{
height: 100px;
background-color: blue;
} <body id="body_id">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras tincidunt pharetra dui, non efficitur mauris scelerisque sed. Donec auctor ut sem vitae bibendum. Aliquam dignissim aliquet augue et condimentum. Aliquam non dui velit. Aenean egestas ligula eget urna malesuada imperdiet. Vivamus vel velit dapibus, sollicitudin dolor at, elementum quam. Aenean eu libero vel velit faucibus convallis. Nullam et velit a ipsum sagittis malesuada. <p>
<body>
<form id="brightness_change_form">
<label for="decrease_brightness" id="change_brightness_label">Change Brightness:</label>
<input type="button" id="decrease_brightness" value="Decrease Page Brightness">
<input type="button" id="increase_brightness" value="Increase Page Brightness">
<input type="button" id="reset_brightness" value="Reset Page Brightness">
</form>您也可以尝试使用HSL（色调，饱和度，轻度）仅更改不会影响按钮的背景色亮度。我在上述代码中留下了评论，供您尝试自己。