主页 / coding / 问题 / 79108412
Accepted
Valentin Vignal
Asked: 2024-10-21 10:39:16 +0800 CST

如何将 <a> 嵌套在 <a> 内？[重复]

  • 772

我正在使用 Svelte 5。

<a href="my-first-link">
    <div>
        <!-- Some elements -->
    </div>
    <a href="my-second-link">
        <div>
            <!-- Some other elements -->
        </div>
    </a>
    <div>
        <!-- Some elements -->
    </div>
</a>

Svelte 抛出了 lint 错误：

`<a>` is invalid inside `<a>`svelte(node_invalid_placement)

在这种情况下，需要做什么才能解决这个问题？

html

2 个回答

  1. Best Answer

    这是意料之中的。您不能在<a>标签内包含交互式内容。由于<a>标签本身就是交互式元素，因此您无法嵌套它们。您必须重新设计您的标记以解决这个问题。

    https://html.spec.whatwg.org/#interactive-content

    • 5

  2. 在 Svelte 中，无法直接将元素堆叠在一起。您必须重新组织结构，使每个链接都独立，才能修复 lint 错误。这是代码重构的一种方法：

    <a href="my-first-link">
    <div>
        <!-- Some elements -->
    </div>
</a>
<a href="my-second-link">
    <div>
        <!-- Some other elements -->
    </div>
</a>
<div>
    <!-- Some elements -->
</div>

    为了避免无效嵌套，请将第二个标签移到第一个标签之外。现在，每个链接都可以独立运行。

    • 1

相关问题