jQuery로 html 테이블을 루핑하기

Question

나는 HTML 테이블을 가지고 있고 기본적으로 각 행과 각 셀을 반복하여 결과를 간단히 출력하고 싶습니다. 한 가지는 입력 상자가있는 셀이 있고 일부는 선택 드롭 다운이 있고 일부는 TD 내부에 원시 콘텐츠가 있습니다.

html 테이블의 모든 셀을 간단하게 루핑하고 각 셀의 결과를 얻는 가장 빠른 방법은 무엇입니까? select 드롭 다운에 대해 select (표시 텍스트가 아님) 값을 캡처하려고합니다.

$("#myTable tr").each(function() { 
    // this represents the row 
    $("td > *", this).each(function() { 
     // nodeName attribute represents the tag - "INPUT" if element is <input> 
     // use the type attribute to find out exactly what type 
     // of input element it is - text, password, button, submit, etc.. 
     if(this.nodeName == "INPUT") { 
      console.log($(this).attr("type")); 
     } 
    }); 
}); 

#myTable > tr 어떤 id="myTable"의 모든 하위 <tr> 요소를 얻을 의미 : 각 셀 내부에 하나의 요소가있을거야 때문에

Answer 1

온라인 데모 : 내가 먼저 각 TD를 순환 여부 평가 또는하여 first-child있어 http://jsbin.com/ewazu

는 input 요소입니다. 그것이 그렇다면, 우리는 그 가치를 반환합니다. 그렇지 않은 경우 텍스트를 생성하는지 묻습니다. 텍스트가 생성되면 텍스트를 요청합니다.

$("table td").each(function(i,o){ 
    var value = ($(":first-child", this).is(":input")) 
    ? $(":first-child", this).val() 
    : ($(this).text() != "") 
     ? $(this).text() 
     : $(this).html() ; 
    alert(value); 
}); 

Answer 2

, 당신은 뭔가를 할 수 있습니다.

마찬가지로 td > *은 바로 개체로 표시되는 <td> 요소의 하위를 모두 가져 오는 것을 의미합니다. 이것들은 모두 CSS 선택자이며 DOM에서 항목을 선택하는 다양한 방법이 있습니다. 선택자에 대해 자세히 알아 보려면 jQuery docs을 참조하십시오.

jQuery core docs는 jQuery 객체에서 사용 가능한 모든 메소드를 확인하는 훌륭한 참고 자료입니다.

Answer 3

그것은 당신이 원하는 정확히을 알고 어렵다,하지만 당신은 그 TD의이 선택 상자로 가정 할 경우,이 같은 것을 할 수있는 유일한 텍스트 필드를 입력하여 해당, TD의이 : http://jsbin.com/alara3/edit

을

Answer 4

당신은 다음과 같은 코드를 사용할 수 있습니다 : 그것은 텍스트를 생성하지 않는 경우, 우리는 TD에 대한 HTML을 요청합니다.

$(':input', '#tableId').val('');