javascript - 如何在 html 中调用另一个 ID 中的特定 ID？

Question

这是page2.html的内容

<div data-role="page" data-theme="b" id="pageone">  
    <div data-role="content">
        <div class="site_wrap wrap">
            <div class="img_slides_wrap slides_wrap wrap">  

            <div>    <img id="slide1" class="img_slide slide active" src="img/slide0.jpg" alt="" title=""/> </div>
             <div>   <img id="slide2" class="img_slide slide" src="img/slide1.jpg" alt="" title=""/> </div>
             <div>   <img id="slide3" class="img_slide slide" src="img/slide2.jpg" alt="" title=""/> </div>
             <div>    <img id="slide4" class="img_slide slide" src="img/slide3.jpg" alt="" title=""/> </div>
             <div>   <img id="slide5" class="img_slide slide" src="img/slide4.jpg" alt="" title=""/> </div>
            </div>
        </div> 
        <a href="#pagetwo">SHARE</a>
    </div>
</div>

现在我需要在点击 page1.html 中的第三张图片时获取“slide3”，这是它的代码

<li> <a href='page1.html#pageone#slide3' ><img src="img/thumb/a.jpg" alt="Image a" width="30" height="48"/></a></li>

问题是当我点击 page2.html 中的第三张图片而不是第一张图片时，我无法获取幻灯片 3...我哪里出错了，请帮助我。

Answer 1

ID 在文档中必须唯一。

您不能有重复的 ID。

URL 片段标识符语法不支持“X in Y”语法，因为“X”必须是唯一的，因此“in Y”将是多余的。

所有你需要的，如果你的 HTML 是 valid , 是 href="page1.html#slide3"。