美文网首页
FCC-JS-JQ-Change Text with Click

FCC-JS-JQ-Change Text with Click

作者: zhang_yongfeng | 来源:发表于2018-10-26 21:28 被阅读0次

    通过点击事件来更改文本。
    当我们点击按钮时,我们可以更新HTML页面
    任务:点击"Get Message"按钮,将class为message的元素的文本改为:“Here is the message”。
    为此在我们的点击事件中加入如下代码:

    $(".message").html("Here is the message”);
    

    示例:

    <script>
      $(document).ready(function() {
        $("#getMessage").on("click", function(){
          // 请把你的代码写在这条注释以下
          $(".message").html("Here is the message");
          // 请把你的代码写在这条注释以上
        });
      });
    </script>
    
    
    <div class="container-fluid">
      <div class = "row text-center">
        <h2>Cat Photo Finder</h2>
      </div>
      <div class = "row text-center">
        <div class = "col-xs-12 well message">
          The message will go here
        </div>
      </div>
      <div class = "row text-center">
        <div class = "col-xs-12">
          <button id = "getMessage" class = "btn btn-primary">
            Get Message
          </button>
        </div>
      </div>
    </div>
    

    相关文章

      网友评论

          本文标题:FCC-JS-JQ-Change Text with Click

          本文链接:https://www.haomeiwen.com/subject/fualtqtx.html