在jQuery中通过类名获取值

ndasle7k  于 2023-06-22  发布在  jQuery
关注(0)|答案(3)|浏览(165)

我想在jQuery中通过类名获取文本。我已经创建了一个函数来通过类名获取元素的文本,但是使用这个函数,我将获取使用同一个类的三个元素的所有文本。我想获取数组中的文本,比如x[0]或x[1]等等。
接下来我可以尝试什么?

<!DOCTYPE html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script>
      $(document).ready(function(){
        $("#hide").click(function(){
          myfunction();

        });

        function myfunction(index) {
          var x = $(".check").text();

          $("#demo").text(x);}
      });
    </script>
  </head>
  <body>
    <div id="main">
      <p class="check">If you click on the "Hide"</p>
      <p class="check">button, I will disappear.</p>
      <p class="check">If you click on the "Hide" button</p>
    </div>
    <p id="demo">"Hide" button</p>
    <button id="hide">Hide</button>
    <button id="show">Show</button>

  </body>
</html>
42fyovps

42fyovps1#

您可以创建一个数组,并通过使用.each()迭代来推送每个元素的text(),在任何需要的地方使用该数组。

$(document).ready(function(){
  $("#hide").click(function(){
  myfunction();
  });

  function myfunction(index) {
  var array = [];
  var x = $(".check").each(function(){array.push($(this).text())});
  console.log(array);
  $("#demo").text(array);}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<div id="main">
<p class="check">If you click on the "Hide"</p>
<p class="check">button, I will disappear.</p>
<p class="check">If you click on the "Hide" button</p>
</div>
<p id="demo">"Hide" button</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
kpbwa7wx

kpbwa7wx2#

你可以使用.each()jquery函数将每个段落保存在一个数组中。运行代码以查看结果。希望这个答案是你正在寻找的:

$(document).ready(function(){
  $("#hide").click(function(){
    myfunction();
  });

  function myfunction(index) {
    var x = [];
    $(".check").each(function() {
       x.push($(this).text());
    });
    $("#demo1").text(x[0]);
    $("#demo2").text(x[1]);
    $("#demo3").text(x[2]);
  }
});
#main{
border-bottom: 1px solid #ccc;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<div id="main">
<p class="check">If you click on the "Hide"</p>
<p class="check">button, I will disappear.</p>
<p class="check">If you click on the "Hide" button</p>
</div>
<p id="demo1">first check</p>
<p id="demo2">second check</p>
<p id="demo3">third check</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
oxcyiej7

oxcyiej73#

你可以这样解决这个问题

//Declare an Array
    var data=[];
   /**
     * Extract data from array element
     */
    var mydata = $(".check").each(function()
    {
    data.push(
    $(this).text())
    });

   //You can access your first p tag element 
    console.log(data[0]);

相关问题