技術標籤：js

先寫點個人對JQuery物件和DOM物件的理解,僅從個人時間總結,不一定正確,表述也未必到位 :

DOM物件的特點(個人總結) :

1. 當在JQuery中篩選出的元素是個集合時,為了要遍歷,所以會轉為DOM來處理;
2. 如果要對一個節點中的屬性,進行獲取,其實也是挺方便的;有些時候,可以將一組資料都放到一個節點裡,採用自定義屬性的方式;必要時一次性獲取相應的值,返回給後端(為此我曾將資料放在不同的元素自定義屬性下,在獲取時增加了很大的難度,這點特別值得注意,感覺使用場景而定);
3. 一開始,我將DOM和JQuery篩選器的父子同級等混為一個概念,做的很痛苦,其實兩者是不同的物件,一個是DOM物件,一個是JQuery物件,很多方法是不通用的,一個是整體,一個是區域性(細節)的概念;
4. 兩者可以採用$()和帶下標[0]的形式,將物件進行互轉;
5. 暫時想到這些,以後再補充.

var label=$("input[name=ehehe]");
    $.each(label, function(i) {     
        alert(label[i].value);           

    });  

for (var Key in event.point){
    Websitelogo =event.point+'&'+''+Key+'='+event.point[Key]+'';
  }
alert(Websitelogo); 
 

我在一個運用場景下,採用如下的程式碼來實現功能:

1. 取值的元素,是動態生成於id為#tbAdd的(table表格)下,進行的apend元素;
2. 取的是apend元素span下的input文字框,要求文字框屬性testChange為true;
3. 去除所有資料後,進行遍歷;

var label =$("#tbAdd span").find("input[testChange='true']"); 
// 取值:有變化的項;
	$.each(label, function(i) {
			alert("值為:" + label[i].value); // 文字框輸入的值					
 

//			alert("節點屬性名為:" + label[i].attributes[0].nodeName); // type
//			alert("接點屬性名為:" + label[i].attributes[1].nodeName); // testChange
//			alert("節點屬性值為:" + label[i].attributes[0].nodeValue ); // text-input的型別
//			alert("節點屬性值為:" + label[i].attributes[1].nodeValue ); // true-是否有變更
			alert("節點屬性pid值為:" + label[i].attributes[2].nodeValue ); // pic的值
	});

轉載部分=====================

1.HTML程式碼

<div name="students" school="HK">  
      <input type="boy" name="ZhangSan" value="206">  
      <input type="girl" name="Lisi" value="108">  
</div>  

2.jquery

<script type="text/javascript">  
    /* find() 查詢子元素方法 */  
    var aaa = $("div[name='students'][school='HK']").find("input[type='boy'][name='ZhangSan']");  
    console.log(aaa.val());  
          
    /* $(".child",parent); 方法查詢子元素*/  
    var bbb = $($("input[type='boy'][name='ZhangSan']"),$("div[name='students'][school='HK']"));  
    console.log(aaa.val());  
  
    /*  each()方法遍歷陣列 */  
    var arr = [ "one", "two", "three", "four" ];  
    $.each(arr, function() {  
        console.log(this);  
    });  
          
    /* each()方法處理json */  
     var obj = {  
           one : 1,  
           two : 2,  
           three : 3,  
           four : 4  
     };  
      $.each(obj, function(key, val) {  
         console.log(obj[key]);  
      });  
      
     /* each()方法處理二維陣列 */  
       var arr1 = [ [ 11, 44, 33 ], [ 4, 6, 6 ], [ 7, 20, 9 ] ]  
       $.each(arr1, function(i, item) {  
           console.log(item[0]);  
       });  
  
     /* each()方法處理HTML元素 */  
      $("div[name='students'][school='HK'] > input").each(function() {  
           console.log($(this).val());  
      });  
 </script>