|
Сообщение от Ops
|
|
вывести ... ul class="s-sub-list" с подпунктами.
|
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
section {
border: 1px solid red;
margin: 2px;
}
ul {
border: 1px solid #008000;
}
</style>
</head>
<body>
<a class="semiroot" href="/punkt-spiska/">Пункт списка</a>
<ul class="s-catalog-list">
...
<li class="">
<a href="/punkt-spiska/">Пункт списка</a>
<div>
<ul class="s-sub-list">
<li class="s-sub-item">
<a class="s-sub-header" href="/punkt-spiska/pod-punkt-spiska-1/">Под-пункт списка 1</a>
</li>
<li class="s-sub-item">
<a class="s-sub-header" href="/punkt-spiska/pod-punkt-spiska-2/">Под-пункт списка 2</a>
</li>
<li class="s-sub-item"><a class="s-sub-header" href="test">test</a>
</li>
<li class="s-sub-item">
<a class="s-sub-header" href="/punkt-spiska/pod-punkt-spiska-2/">Под-пункт списка 3</a>
</li>
<li class="s-sub-item"><a class="s-sub-header" href="/punkt-spiska/pod-punkt-spiska-4/">Под-пункт списка 4</a>
</li>
</ul>
</div>
</li>
<li class="">
<a href="/punkt-spiska/">Пункт списка</a>
<div>
<ul class="s-sub-list">test</ul>
</div>
</li>
</ul>
<h3>section</h3>
<section></section>
<script>
let patern = document.querySelector('.semiroot').getAttribute('href');
let sel = `[href*="${patern}"]`;
let uls = Array.from(document.querySelectorAll('ul.s-catalog-list ul.s-sub-list')).filter(ul => ul.querySelector(sel));
document.querySelector('section').append(...uls.map(ul => {
ul = ul.cloneNode(true);
ul.querySelectorAll('ul.s-sub-list > li.s-sub-item').forEach(li => li.querySelector(sel) || li.remove())
return ul
}))
</script>
</body>
</html>