Javascript 隐藏链接标记中的第n个子项

我有以下HTML和JS

<div class = "tab-menu">
    <ul class = "tabs">
        <a><li>List item 1</li></a>
        <a><li>List item 2</li></a>
        <a><li>List item 3</li></a>
    </ul>
</div>

---

我尝试了我能想到的每一种变体，让JS识别它需要隐藏的列表项，但我找不到它。我能了解一些情况吗？

你应该先在

标记中移动你的
标记。
你应该先在
标记中移动你的
标记。
尽管你的HTML是无效的（锚点不能是
的直接子节点），您需要处理
锚定节点
才能使其正常工作

jQuery(".tab-menu .tabs > a:nth-child(3)").hide();

但无论如何，这只是纯粹的理论。即使这可能有效，您也需要将元素的顺序固定到
中，尽管事实上您的HTML无效（锚定不能是
中的直接子节点），但您需要寻址
锚定
节点以使其工作

jQuery(".tab-menu .tabs > a:nth-child(3)").hide();

但无论如何，这只是纯粹的理论。即使这样做可行，您也需要将元素的顺序固定到
中，您不能在
标记中包含
标记

试着这样做

<ul>
    <li><a href="">List item 1</a></li>
    <li><a href="">List item 2</a></li>
    <li><a href="">List item 3</a></li>
</ul>

在
标记内不能有
标记

试着这样做

<ul>
    <li><a href="">List item 1</a></li>
    <li><a href="">List item 2</a></li>
    <li><a href="">List item 3</a></li>
</ul>

您不能在
a
标记中包含
li
标记。
反向将在那里工作，看看下面的代码段


$（函数（）{
jQuery（“.tab-menu.tabs>li:nth-child（3）”）.hide（）；
})


清单项目1
清单项目2
清单项目3

您不能在
a
标签中包含
li
标签。
反向将在那里工作，看看下面的代码段


$（函数（）{
jQuery（“.tab-menu.tabs>li:nth-child（3）”）.hide（）；
})


清单项目1
清单项目2
清单项目3

此处无需使用jQuery。清理HTML语法后，可以使用CSS隐藏列表中的项目，如下所示：

ul > li:first-child {display: none;} /* hides first child */
ul > li:nth-child(2) {display: none;} /* hides the nth-child [in this case, the second child] */
ul > li:last-child {display: none;} /* hides the last child */

这里不需要使用jQuery。清理HTML语法后，可以使用CSS隐藏列表中的项目，如下所示：

ul > li:first-child {display: none;} /* hides first child */
ul > li:nth-child(2) {display: none;} /* hides the nth-child [in this case, the second child] */
ul > li:last-child {display: none;} /* hides the last child */

您的HTML无效。它应该像
列表项1
，ul元素只能有li作为子元素您的HTML无效--
ol
或
ul
的唯一有效子元素是an
li
要使整个
li
可点击，请使用正确的HTML并使a元素
显示：block
您的HTML无效。它应该像
列表项1
，ul元素只能有li作为子元素。您的HTML无效--
ol
或
ul
的唯一有效子元素是an
li
，要使整个
li
可单击，请使用正确的HTML并使a元素
显示：block