Question

console.log($('.tree-node > .tree-title:contains(Statistics)').parents('li > ul > li:nth-child(2) > ul > li:nth-child(1) > div > .tree-title ').val())

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<li>
    <div class="tree-node">
      <span class="tree-hit"></span>
      <span class="tree-icon"></span>
      <span class="tree-title">Nop</span>
    </div>
</li>
<li>
    <div class="tree-node">
      <span class="tree-hit"></span>
      <span class="tree-icon"></span>
      <span class="tree-title">Statistics</span>
    </div>
    <ul style="display: block;">
        <li>
            <div class="tree-node">
              <span class="tree-indent"></span>
              <span class="tree-hit"></span>
              <span class="tree-icon"></span>
              <span class="tree-title">Cumulative</span>
            </div>
            <ul style="display:block">
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">137</span>
                    </div>
                </li>
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">138</span>
                    </div>
                </li>
            </ul>
        </li>
        <li>
            <div class="tree-node">
              <span class="tree-indent"></span>
              <span class="tree-hit"></span>
              <span class="tree-icon"></span>
              <span class="tree-title">Current</span>
            </div>
            <ul style="display:block">
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">149</span>
                    </div>
                </li>
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">150</span></div>
                </li>
            </ul>
        </li>
    </ul>
</li>

我试图根据子值获取值149，在这种情况下，我只想在设置<span class="tree-title">Statistics</span>的情况下使用。在我的jQuery代码中，我得到了undefined

Answer 1

你很近。仔细查看子元素/父元素，请参见下面的示例。

更新：更改示例以选择所有当前值。

var currentNodes = $('.tree-node > .tree-title:contains(Statistics)')
  .parents('li:first') // Find the first parent <li> from Statistics
  .find('.tree-title:contains(Current)') // Find a child with Current
  .parents('li:first') // Find the first parent <li> from Current
  .find('ul > li .tree-title'); // Find the .tree-title nodes within a <ul>

// currentNodes is now a collection of .tree-title elements.

// You can traverse the list with a loop.
currentNodes.each(function(i, item) {
  console.log(`Value ${i}: ${item.innerHTML}`);
});

// You can select specific elements from the list by index.

console.log('This is the second value: ', currentNodes[1].innerHTML);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<li>
    <div class="tree-node">
      <span class="tree-hit"></span>
      <span class="tree-icon"></span>
      <span class="tree-title">Nop</span>
    </div>
</li>
<li>
    <div class="tree-node">
      <span class="tree-hit"></span>
      <span class="tree-icon"></span>
      <span class="tree-title">Statistics</span>
    </div>
    <ul style="display: block;">
        <li>
            <div class="tree-node">
              <span class="tree-indent"></span>
              <span class="tree-hit"></span>
              <span class="tree-icon"></span>
              <span class="tree-title">Cumulative</span>
            </div>
            <ul style="display:block">
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">137</span>
                    </div>
                </li>
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">138</span>
                    </div>
                </li>
            </ul>
        </li>
        <li>
            <div class="tree-node">
              <span class="tree-indent"></span>
              <span class="tree-hit"></span>
              <span class="tree-icon"></span>
              <span class="tree-title">Current</span>
            </div>
            <ul style="display:block">
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">149</span>
                    </div>
                </li>
                <li>
                    <div class="tree-node">
                      <span class="tree-icon"></span>
                      <span class="tree-title">150</span></div>
                </li>
            </ul>
        </li>
    </ul>
</li>

如何获得价值取决于孩子的价值

1 个答案: