zoukankan      html  css  js  c++  java
  • jQuery HTML

    获取内容和属性

      jQuery - 获得内容和属性

        jQuery 拥有可操作 HTML 元素和属性的强大方法。

        jQuery 提供一系列与 DOM 相关的方法,这使访问和操作元素和属性变得很容易。

      获得内容  -  text()、html() 以及 val()

        三个简单实用的用于 DOM 操作的 jQuery 方法:

           text()    设置或返回所选元素的文本内容

           html()    设置或返回所选元素的内容(包括 HTML 标记

           val()    设置或返回表单字段的值

      获取属性  -  attr()

        attr() 方法用于获取属性值。

        下面的例子演示如何获得链接中 href 属性的值:

          $("button").click(function(){
            alert($("#w3s").attr("href"));
          });

    设置内容和属性

      设置内容  -  text()、html() 以及 val()

         在方法中加入要设置的值(字符串)

      设置属性  -  attr()

         jQuery attr() 方法也用于设置/改变属性值。(而且允许同时设置多个属性。)

          $("button").click(function(){
            $("#w3s").attr({
              "href" : "http://www.w3school.com.cn/jquery",
              "title" : "W3School jQuery Tutorial"
            });
          });

    添加元素

        通过 jQuery,可以很容易地添加新元素 / 内容。

        append() 方法    在被选元素的结尾插入内容。    实例:  $("p").append("Some appended text.");

        prepend() 方法    在被选元素的开头插入内容。    实例:  $("p").prepend("Some prepended text.");

      通过 append() 和 prepend() 方法添加若干新元素:

          在上面的例子中,我们只在被选元素的开头/结尾插入文本/HTML。

          不过,append() 和 prepend() 方法能够通过参数接收无限数量的新元素。可以通过 jQuery 来生成文本/HTML(就像上面的例子那样),或者通过 JavaScript 代码和 DOM 元素。

          在下面的例子中,我们创建若干个新元素。这些元素可以通过 text/HTML、jQuery 或者 JavaScript/DOM 来创建。然后我们通过 append() 方法把这些新元素追加到文本中(对 prepend() 同样有效):

            function appendText()
            {
              var txt1="<p>Text.</p>";               // 以 HTML 创建新元素
              var txt2=$("<p></p>").text("Text.");   // 以 jQuery 创建新元素
              var txt3=document.createElement("p");  // 以 DOM 创建新元素
              txt3.innerHTML="Text.";
              $("p").append(txt1,txt2,txt3);         // 追加新元素
            }

       通过 after() 和 before() 方法添加新若干元素:

          同上,……

  • 相关阅读:
    php 安装shpinx扩展
    sphinx 配置实例
    java系统监控分析Jprofile下载及安装配置【转】
    Java监控工具介绍,VisualVm ,JProfiler,Perfino,Yourkit,Perf4J,JProbe,Java微基准测试【转】
    Java虚拟机性能管理神器
    Java虚拟机性能管理神器
    Java虚拟机性能管理神器
    Java虚拟机性能管理神器
    Java虚拟机性能管理神器
    jvisualvm图解【转】
  • 原文地址:https://www.cnblogs.com/zhangchaoran/p/8057708.html
Copyright © 2011-2022 走看看