Javascript 从类中获取值(value)

Question

我正在尝试将其用于类作业，我仍在学习中。

此脚本用于检查站点是否关闭。

我想要实现的是使用相同的脚本并获取表中每个网站的状态，而无需在所有 3 个网站上再次使用脚本。

我添加了类，但我不知道如何让它们编写脚本。我对脚本进行了评论，以便您更容易理解。有什么解决办法吗？任何输入将不胜感激。

<table>
    <thead>
        <tr>
            <th style="width:250px">Website</th>
            <th style="width:250px">Is it live</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Google</td>                                   

            <td id="website"></td>  <!-- This is already working. -->

        </tr>
        <tr>
            <td>Twitter</td>

            <td id="website" mywebsite="https://Twitter.com"></td> <!-- This is what I'm trying to achive. -->


        </tr>
        <tr>
            <td>Facebook</td>

            
            <td id="website" mywebsite="https://Facebook.com"> <!-- This is what I'm trying to achive. -->

        </tr>
    </tbody>
</table>





<script src="https://code.jquery.com/jquery-1.12.4.js"></script>



<script type="text/javascript">
    var site = 'https://google.com';



    // var site = 'https://google.com';
    
    $.ajax
    ({
      url: site,
      dataType: "jsonp",
      statusCode: {
          200: function (response) {
              $('#website').html('yes');
            console.log(response);
          },
          404: function (response) {
              $('#website').html('no');
            console.log(response);
          }
      } 
     });
</script>

Answer 1

<table>
        <thead>
            <tr>
                <th style="width:250px">Website</th>
                <th style="width:250px">Is it live</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Google</td>                                   

                <td class="website" data-mywebsite="https://google.com"></td>  <!-- This is already working. -->

            </tr>
            <tr>
                <td>Twitter</td>

                <td class="website" data-mywebsite="https://twitter.com"></td> <!-- This is what I'm trying to achive. -->


            </tr>
            <tr>
                <td>Facebook</td>


                <td class="website" data-mywebsite="https://facebook.com"> </td>

            </tr>
        </tbody>
    </table>



$(document).ready(function(){
         $(".website").each(function(){
           var site = $(this).attr("data-mywebsite");
           var thissr = $(this);

        $.ajax
        ({
          url: site,
          dataType: "jsonp",
          statusCode: {
              200: function (response) {
                  thissr.html('yes');

              },
              404: function (response) {
                  thissr.html('no');

              }
          } 
         });
         });
       });

试试这段代码。这是一个 fiddle

您需要使用类并循环遍历它们中的每一个以发送 AJAX 请求。