AI智能
改变未来

jQuery过滤选择器first/last child, nth-child(n)失效的问题

笔者最近碰到一个如题的问题,记录如下:

<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><title>Title</title><!--引入jQuery的函数库--><script src=\"js/jquery-3.4.1.js\"></script></head><body><!--<span></span>--><ul><li>上海</li><li>北京</li><li>南京</li></ul><ul><li>江苏省</li><li>海南省</li><li>浙江省</li></ul><script>// text(): 此方法是获取纯文本;html(): 获取带标签的文本console.log($(\'ul:first-child>li:first-child\').text());console.log($(\'ul:nth-child(2)\').html());/*** 找不到最后一个ul标签: 因为first/last-child的查找过程是:* 1.找到父节点(<body>)* 2.找第一个子节点/最后一个子节点,如果(体现过滤)匹配<ul>则找到.否则没找到会失效* 所以此时不能找到最后一个<ul>,因为<body>最后一个是<script>* 如果在第一个<ul>节点上加一个其它标签,同理不能找到第一个<ul>** 对于nth-child(n)的失效,原理同上*/console.log($(\'ul:last-child>li:last-child\').text());</script></body></html>
赞(0) 打赏
未经允许不得转载:爱站程序员基地 » jQuery过滤选择器first/last child, nth-child(n)失效的问题