Javascript “变换类别”下拉列表使用moovweb进行切换

我想将toggler添加到以下代码中：

<div class="z100" id="category-sidebar">
    <h3 class="header">
        <a class="header" href="/shop/us/en/#">
        <span>The Latest</span>
        </a>
    </h3>   
    <ul class="show-more limit-10" style="display: block;">
        <li class=" first">
            <a href="/shop/us/en/mens/new-arrivals"><span>New Arrivals</span></a>
        </li>
    ......
    </ul>
    <h3 class="header">
        <a class="header" href="/shop/us/en/#">
        <span>The Latest</span>
        </a>
    </h3>   
    <ul class="show-more limit-10" style="display: block;">
        <li class=" first">
            <a href="/shop/us/en/mens/new-arrivals"><span>New Arrivals</span></a>
        </li>
    ......
    </ul>
    ......
</div>

但无法将切换头移动到正确的位置

html() {
    $('//div[@class="z100"]') {
        attribute('data-ur-set','toggler')
        attribute('style','border: 1px red so;id;')
        $('//h3[@class="header"]') {
            name('div')
            attribute('data-ur-toggler-component','button')
        }
        $('//ul[@class="show-more limit-10"]') {
            name('div')
            attribute('data-ur-toggler-component','content')
            $('.//li') {
                name('div')
            }
        }
    }
}

还要在sass文件中编写以下代码

[data-ur-toggler-component="content"] {
  display: none;
  &[data-ur-state="enabled"] {
    display: block;
  }

并从html中删除内联属性display=“block”

---

参见

@Oleg Etsekhin:对回复感到困惑它不是回复，而是半自动的“改进”操作。我不知道为什么你原来的大部分改进都在哪里丢失了，我现在就修复它。