1. 程式人生 > >javascript通過選擇器獲取標籤的內容的方法

javascript通過選擇器獲取標籤的內容的方法

第一種開啟視窗就載入。 //窗體一載入就會執行$後的方法
 $(function(){// 在這裡寫你的程式碼...
 });

/* $(document).ready(function(){
 // 在這裡寫你的程式碼...
alert("hello");

第二步,通過需要基本選擇器來實現。

$("#id"),$("標籤"),$(".類")

2.1帶有層級的選擇器

$("選擇器1 選擇器2") //獲取選擇器1下的選擇器2對應的標籤。

2.2

$("選擇器1,選擇器2")//獲取選擇器1和選擇器2對應的標籤

其他方式可以通過幫助文件自行了解。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jquery選擇器</title>
<meta http-equiv ="content-type" content ="text/html:charset=UTF-8"/>
    <!--匯入選擇器-->
<!--<script src="../資料夾/jquery.js" type="text/javascript"></script>-->
<script src="jquery-1.11.1.js"></script>
<script>
//窗體一載入就會執行$後的方法
$(function(){
var mytable=$("#mytable"); 
alert(mytable.html());
var ulNode=$(".main");
alert(ulNode.html());

var p=$("p");
alert(p.html());
        //這些程式碼語句看不懂就要去插幫助文件每個事件,屬性,物件的屬性或方法
var btn=$("input[type='button']");
alert(btn.val());
var text=$("input[type='text']");
alert(text.val());


});
/* $(document).ready(function(){
// 在這裡寫你的程式碼...
alert("hello");
}); */
</script>
 </head>
 <body>
 <table id="mytable" border="1" >
  <thead><th>學號</th><th>姓名</th></thead>
  <tbody>
   <tr><td>0001</td><td>張三</td></tr>
   <tr><td>0002</td><td>李四</td></tr>
  </tbody>
 </table>
 <br><br>
 <p>hellword</p>
 <ul class="main">
  <li>學習用品</li>
  <li>傢俱用品</li>
  <li>電器</li>
 </ul>
 <br>
 <input type="button" value="aa"/>
 <br>
 <input type="text" id=="name" value="zhangsan"/>
 </body>

</html>

如果第一步不想一載入就彈出獲取內容可以寫成函式用時間呼叫,在標籤script內寫方法,在body內寫按鈕呼叫

function f(){
var mytable=$("#mytable"); 
alert(mytable.html());
var ulNode=$(".main");
alert(ulNode.html());



var p=$("p");
alert(p.html());
        //這些程式碼看不懂就要去插幫助文件每個事件,屬性,物件的屬性或方法
var btn=$("input[type='button']");
alert(btn.val());
var text=$("input[type='text']");
alert(text.val());


}

<input type="button" value="顯示標籤" onclick="f()">