JavaScript 选择器错误：nth-child vs nth.child | 代码调试技巧 - 常规

<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script> window.onload = function () { var btn = document.querySelector("button:nth-child(1)"); btn.onclick = function() { alert("555"); } } </script> </head> <body> <button>按钮1</button> <button>按钮2</button> <button>按钮3</button> </body> 为什么没反应内容：代码中的错误是在选择器中的拼写错误。应该是nth-child而不是nth.child。修改后的代码如下： html <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script> window.onload = function () { var btn = document.querySelector("button:nth-child(1)"); btn.onclick = function() { alert("555"); } } </script> </head> <body> <button>按钮1</button> <button>按钮2</button> <button>按钮3</button> </body>  修改后的代码中，选择器button:nth-child(1)将选择第一个button元素。然后，将为该按钮添加onclick事件，当点击按钮时，弹出一个包含文本555的警告框。请确保将代码正确地复制并粘贴到您的HTML文件中，并确保在浏览器中正确加载该文件。