请问弹出层的问题

Question

下面代码，第一个可以打开，第二个不行。因为id重复。

可是我的页面id不确定有多少个，难道要给每个链接一个不同的id的吗？有没有别的办法？
我就是希望每个链接都在弹出层里面的iframe打开。

<script>
      $(function(){
     $("#open").click(function(){
          $(".m").fadeIn();
        });
      });
</script>

<div class="m">
<iframe name="frame1" id="frame1" frameborder=0 src="" width="100%" height="100%"></iframe>
</div>

<a href="http://www.baidu.com/" id="open" target="frame1">打开1</a> 
<a href="http://www.263.net/" id="open" target="frame1">打开2</a> 

Answer 1

id 在同一个 HTML 应该只出现一次，因为它应该唯一识别一个元素。

如果对于多个相似的元素，我们可以认为是“相同类型”，一般用 class 来标识，比如

顺便，一般把脚本写在 HTML 的后面，避免阻塞 HTML 加载

    <div class="m">
        <iframe name="frame1" id="frame1" frameborder=0 src="" width="100%" height="100%"></iframe>
    </div>

    <a href="http://www.baidu.com/" class="open" target="frame1">打开1</a>
    <a href="http://www.263.net/" class="open" target="frame1">打开2</a>

    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        $(function () {
            $(".open").click(function () {
                $(".m").fadeIn();
            });
        });
    </script>