javascript - 尽管我使用 # idname 选择了所有 ID，但为什么所有 ID 都没有更改？

Question

总的来说，我对编码完全陌生。我从 HTML、CSS 和 JavaScript 的基础知识开始。

我有两段:

<p id="title1">Change this</p>
<p id="title1"> Change this too! </p>

虽然第一个被自动更改为:

<script type="text/JavaScript">
    $('#title1').html('Changed!');
</script>

第二个没有。但不应该吗？既然所有的 #title1 都被改变了？

onclick 版本也有同样的问题。单击第一段时，第一段会发生变化，第二段则不会。

<p id="title3" onclick="sayGoodbye();">Toggle this Hello - Goodbye</p>
<p id="title3" onclick="sayGoodbye();">Thing to click on</p>

<script type="text/javascript">
    function sayGoodbye(){
        $("#title3").html('Goodbye');
        $("#title3").click(function(){
            $("#title3").html("Hello again!");
            $("#title3").off("click");
        });
    }
</script>

Answer 1

当你通过它的 id 选择一个元素时，只有第一个被选中，因为你只能在一个元素上使用一个 id!每个 ID 只能在一个页面上使用一次!

如果您需要“按”某事将一堆元素放在一起，请按“类”进行。

$(".title1").html("Changed!");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="title1">Change this</p>
<p class="title1"> Change this too! </p>