zoukankan      html  css  js  c++  java
  • jQuery文档操作

    写这篇文章主要是在使用Ajax进行异步请求后更新页面的内容,由于jQuery操作页面内容的方式和方法有很多,这里只列举几个例子来说明一下,具体内容还需要查阅相关文档。

    下面列举的几个例子都是通过一个按钮点击触发相关事件。

    attr

    设置元素属性的值

    <body>
    <img src="/i/eg_smile.gif" />
    <button>设置图像的 width 属性</button>
    </body>
    
    <script type="text/javascript">
    $(document).ready(function(){
      $("button").click(function(){
        $("img").attr("width","180");
      });
    });
    </script>
    

    append

    追加内容

    $("button").click(function(){
      $("p").append(" <b>Hello world!</b>");
    });
    

    text

    修改文本内容

    $("#btn1").click(function(){
        $("#test1").text("Hello world!");
    });
    
    // 需要使用原始内容
    $("#btn1").click(function(){
        $("#test1").text(function(i, origText){
            return "Old text: " + origText + " New text: Hello world!
            (index: " + i + ")"; 
        });
    });
    

    html

    改变标签及其内容

    $("#btn2").click(function(){
        $("#test2").html("<b>Hello world!</b>");
    });
    
    // 需要使用原始内容
    $("#btn2").click(function(){
        $("#test2").html(function(i, origText){
            return "Old html: " + origText + " New html: Hello <b>world!</b>
            (index: " + i + ")"; 
        });
    });
    

    val

    改变元素的值

    $("#btn3").click(function(){
        $("#test3").val("Dolly Duck");
    });
    

    更多文档操作参考: http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp

  • 相关阅读:
    STM32 端口复用配置
    stm32 新建文件记得添加到工程
    keil解决SYSTEMsysstm32f10x.h(298): error: #67: expected a "}"
    解决Keil复制中文乱码
    STM32 MPU6050 源码
    STM32 PWM输出
    STM32定时器
    STM32 看门狗操作姿势
    开课博客
    第二周学习进度
  • 原文地址:https://www.cnblogs.com/suraer/p/8528243.html
Copyright © 2011-2022 走看看