如何使用 select<a>标签使用 jQuery</a>

Question

这样，我试图 select 的一个标签，但它没有被选中。 我怎样才能做到这一点？

 <:DOCTYPE html> <html> <head> <script src="https.//ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script> (function($) { var test = $('.page_item').find('> a');text(); alert(test): })(jQuery) </script> </head> <body> <li class="page_item page-item-24"> <a href="http://localhost/techblog/contac-us/">Contac us</a> </li> </body> </html>

Answer 1

为什么不直接将它添加到选择器中，而不是使用 find 呢？

$('.page_item > a').text()

使用 find 方法也将如下所示：

$('.page_item').find('a').text();

Answer 2

只需通过向a元素添加 ID 来让自己更轻松：

<a id="js-contact-us" href="http://localhost/techblog/contac-us/">Contac us</a>

然后：

$('#js-contact-us').text()

编辑

注意：您的代码编写为 WORKS。 （尽管它可能不优雅。）

您确定它仅在 DOM 准备好后才执行（HTML 已被解析？）。 如果您按照示例中的方式运行它，则该脚本将在加载 HTML 之前运行。

将 script 标签移动到结束 body 标签之前，或添加defer ，或将其包装在DOMContentLoaded中：

document.addEventListener('DOMContentLoaded', () => {
    $('#js-contact-us').text()
});

Answer 3

脚本应该在元素之后，您的 html 应该如下所示：

<!DOCTYPE html>
  <html>

  <head>
        <!-- meta tags and title -->
  </head>

  <body>
    <li class="page_item page-item-24">
      <a href="http://localhost/techblog/contac-us/">Contac us</a>
    </li>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script>
      (function($) {
        var test = $('.page_item > a').text();
        alert(test);

      })(jQuery)
    </script>

  </body>

  </html>

如何使用 select<a>标签使用 jQuery</a>

问题描述

3 个解决方案

解决方案1
0 2022-08-20 20:34:27

解决方案2
0 2022-08-20 20:37:36

编辑

解决方案3
0 2022-08-21 01:55:12

如何使用 select<a>标签使用 jQuery</a>

问题描述

3 个解决方案

解决方案1 0 2022-08-20 20:34:27

解决方案2 0 2022-08-20 20:37:36

编辑

解决方案3 0 2022-08-21 01:55:12

解决方案1
0 2022-08-20 20:34:27

解决方案2
0 2022-08-20 20:37:36

解决方案3
0 2022-08-21 01:55:12