JQuery遍历DOM并提取节点值

Question

我有以下 DOM:

<div class="qtip qtip-light qtip-active">
   <div class="qtip-wrapper">
      <div class="qtip-borderTop"></div>
      <div class="qtip-contentWrapper">
         <div class="qtip-title">
            <div class="qtip-button"></div>
            **Text I need to extract**
         </div>
         <div class="qtip-content">
            <div class="tooltip">
                <div class="button-container">
                    <script type="text/javascript">
            var link = null;
            var link = $('.qtip-active > .qtip-title').val();
            $('.qtip-active > #button-container').append('<a href=\"mailto:' + link + '\">' + link + '</a>');
                </script>
                </div>
            </div>
         </div>
      </div>
      <div class="qtip-borderBottom"></div>
   </div>
</div>

但是当我希望变量 link 返回节点指定的文本时，它始终是未定义的。我已经阅读 jquery 文档几个小时了，但我一定遗漏了一些我的逻辑(或缺乏)。

感谢任何帮助...

Answer 1

尝试:

var link = $('.qtip-active .qtip-title').text();

qtip-title 实际上并不是 qtip-active 的子项。

只是为了澄清:

$("a > b")

表示作为 a 元素子元素的所有 b 的集合，而:

$("a b")

表示所有 b 元素的集合，这些元素是 a 元素的后代。

当然，qtip-title 不是输入元素，因此请使用 text() 而不是 val()。