html 不能选择的空格,为什么innerHTML不能使用空格？

如果您使用此技术，则可能会遇到问题。

很抱歉，不如何将点击事件附加到现代javascript中的元素，至少如果您想使用所谓的“良好做法”。

更好的方法是使用javascript将click事件附加到所需元素。

我会给你一个简短的代码示例。

首先是HTML - 我会使用您原来的HTML(稍加修改)：

Initial text.

front

back

如您所见，我已从按钮中删除了“onclick”事件，并为每个按钮分配了一个ID。

其次，我们会编写一些javascript来正确地将点击事件附加到每个按钮，当然还会执行原本打算执行的文本更改：

如果您熟悉jQuery，那么这样做：

$('#frontBtn').on('click',function(){

$('#para').html('move front');

});

$('#backBtn').on('click',function(){

$('#para').html('back');

});

这也可以使用vanilla(native)javascript：来完成

document.getElementById("frontBtn").addEventListener("click", function(){

document.getElementById("para").innerHTML = "move front";

});

document.getElementById("backBtn").addEventListener("click", function(){

document.getElementById("para").innerHTML = "back";

});

现在我们为每个按钮提供了一个结构合理的事件处理程序，可以轻松添加更多代码。

关于在哪里插入您的javascript？

您可以使用html文档头中的脚本标记将javascript添加到html文档中，如下所示：

// your code here..

....

....

甚至更好 - 创建一个单独的脚本文件并将其加载到html页面的底部，如下所示：

....

....

....

这是使用javascript将事件附加到元素的更好方法。

想象一下，如果你尝试内联编写50-100行代码？不可能！但是使用事件处理函数，您可以轻松完成。

事情基本上会更好，你的项目将更容易维护。

希望它有所帮助！