我的第十二課:jQuery - 獲得內容和屬性



獲得內容 - text()、html() 以及 val()

三個簡單實用的用於 DOM 操作的 jQuery 方法:

  • text() - 設置或返回所選元素的文本內容
  • html() - 設置或返回所選元素的內容(包括 HTML 標記)
  • val() - 設置或返回表單字段的值
  • 獲取屬性 - attr()

    jQuery attr() 方法用於獲取屬性值。

    下面的例子演示如何獲得鏈接中 href 屬性的值:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
  <head>
     <script type="text/javascript" src="js/jquery-1.7.1.js"></script>
     <script type="text/javascript">
         $(document).ready(
            function(){
                $("#button1").click(function(){
                 alert("Test"+$("#iii").text());}
                );
                $("#button2").click(
                    function(){
                    alert("html"+$("#iii").html());
                    }
                );
                 $("#button3").click(
                   function(){
                     alert("value"+$("#testvalue").val());
                   }
                );
                $("#button4").click(
                   function(){
                     alert("href"+$("#href").attr("href"));
                   }
                );
            }
         );
       
        
     </script>

  </head>
 
  <body>
   <p id="iii">你<b>好!</b>嗎</p>
   <input type="text" value="hello word" id="testvalue">
   <p ><a href="http://www.baidu.com.cn" id="href">baidu</a></p>
   <button  id="button1" type="button">顯示文本</button>
   <button  id="button2" type="button">顯示HTML</button>
   <button  id="button3" type="button">顯示value</button>
   <button  id="button4" type="button">顯示 href 值</button>
  </body>
</html>

發佈了40 篇原創文章 · 獲贊 0 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章