2014-09-04 2 views
0

HTML에 배열이 있는데 배열에 "배열에"No Cust "및 다른 값이있는 조건에 따라 테이블에 배열 값을 표시하고 싶습니다. 다른 값만 표시하고 싶었습니다. 배열 크기가 동적으로 변경 될 수 있습니다. 그래서 아래 코드를 시도했다. 그것은 테이블을 생성하지만 텍스트 값을 표시하지 않는, 좋은 말 할 때 당신은 당신의 코드에서 오류가조건에 따라 동적 테이블에 배열 값 표시

<HTML> 
    <HEAD> 
     <TITLE>Sample Page that Writes Out an HTML Table</TITLE> 
    </HEAD> 
    <BODY> 
     <SCRIPT Language="JavaScript"> 
      var text = ["No Cust", "No Cust", "20 cust", "No Cust", "30 Cust", "80 cust", "50 cust"]; 
      count=0; 
      var text2 = ""; 

      for (i=0; i<7; i++) { 
       if (text[i] == "No Cust") { 
        continue; 
       } 
       else { 
        text2[count] = text[i]; 
        count = count + 1; 
       } 
      } 

      document.write('<table border="1" cellspacing="1" cellpadding="5">') 

      for(j = 0; j < count; j++) { 
       document.write('<tr>') 
       document.write('<td> text2[j] </td>') 
       document.write('</tr>') 
      } 

      document.write('</table>') 
     </SCRIPT> 
    </BODY> 
</HTML> 
+1

D o n 't u s e d o c u m u n t. w r i t e'. –

+0

+1 '사용하지 마세요. w r i t e'. – denisol

답변

0

해야한다 단일 루프, 다음과 같이 :

var text = ["No Cust", "No Cust", "20 cust", "No Cust", "30 Cust", "80 cust", "50 cust"]; 

    document.write('<table border="1" cellspacing="1" cellpadding="5">'); 
    for (i = 0; i < text.length; i++) { 
     if (text[i] == "No Cust") { 
      document.write('<tr>'); 
      document.write('<td>' + text[i] + '</td>'); 
      document.write('</tr>'); 
     } 
    } 
    document.write('</table>'); 

작동 Fiddle

0

도움이된다

document.write('<td> text2[j] </td>') 

이는 달성 할 수

document.write('<td>' + text2[j] + '</td>') 
+0

테이블에 + text2 [j] +를 표시하지만 실제 배열 값은 표시하지 않습니다. –

0

text2 [j]를 " '"(작은 따옴표) 안에 포함하여 정적 텍스트로 표시하려고합니다. 그래서 document.write를 (''+ 텍스트 2 [J] +는 '') 내가 루프에 대한 비트 배열의 동적 길이를 처리하도록 재구성 한 문제를

를 해결할 수 : -

<!DOCTYPE html> 
<HTML> 
<HEAD> 
    <TITLE>Sample Page that Writes Out an HTML Table</TITLE> 
</HEAD> 
<BODY> 
    <SCRIPT Language="JavaScript"> 
     var text = ["No Cust", "No Cust", "20 cust", "No Cust", "30 Cust", "80 cust", "50 cust"]; 
     count=0; 
     var text2 = new Array(); 

     for (i=0; i<text.length; i++) { 
      if (text[i] == "No Cust") { 
       continue; 
      } 
      else { 
       text2[count] = text[i]; 
       count = count + 1; 
      } 
     } 

     document.write('<table border="1" cellspacing="1" cellpadding="5">') 

     for(j = 0; j < count; j++) { 
      document.write('<tr>') 
      document.write('<td>'+ text2[j] +'</td>') 
      document.write('</tr>') 
     } 

     document.write('</table>') 
    </SCRIPT> 
</BODY> 
</HTML> 

스크립트에서 몇 가지 실수가 있습니다

<SCRIPT Language="JavaScript"> 
     var text = ["No Cust", "No Cust", "20 cust", "No Cust", "30 Cust", "80 cust", "50 cust"]; 
     document.write('<table border="1" cellspacing="1" cellpadding="5">'); 
     for (i=0; i<text.length; i++) { 
      if (text[i] != "No Cust") { 
       document.write('<tr>') 
       document.write('<td>'+ text[i] +'</td>') 
       document.write('</tr>') 
     } 
     }   
    </SCRIPT> 
1

: 당신이 두 개의 루프를 건너 뛰려면 대신 하나를 사용하는 경우, 아래의 코드입니다. 먼저 다른 사람들이 언급 한 것처럼 구문이 올바르지 않습니다. 할 필요가 없을 때 배열의 길이를 수정하고 있습니다. 또한 필터에서 불필요하게 "No Cust"와 일치합니다. DOM에 여러 번 쓰기 때문에 비용이 많이 듭니다. 이 시도 :

var text = ["No Cust", "No Cust", "20 cust", "No Cust", "30 Cust", "80 cust", "50 cust"], 
    text2 = [], 
    i; 


for (i = 0; i < text.length; i++) { 
    if (text[i] !== "No Cust") { 
     text2.push(text[i]); 
    } 
} 

var table = '<table border="1" cellspacing="1" cellpadding="5">'; 

for (i = 0; i < text2.length; i++) { 
    table += '<tr>'; 
    table += '<td>' + text2[i] + '</td>'; 
    table += '</tr>'; 
} 

table += '</table>'; 

document.getElementById('content').innerHTML = table; 

http://jsfiddle.net/7fbq3ps7/

0

코드는 괜찮습니다,하지만 난 몇 가지를 바꿀 것 :

  • 왜 배열에 가입하지 document.write를

    1. 사용하지 않는 테이블을 만드시겠습니까?

    var text=['No Cust','No Cust','20 cust','No Cust','30 Cust','80 cust','50 cust'], 
        l=text.length, 
        c=0, 
        A=[]; 
    for(;c<l;c++){ 
    text[c]=='No Cust'||A.push(text[c]) 
    } 
    document.body.appendChild(document.createElement('table')).innerHTML= 
    '<tbody><tr><td>'+A.join('</td></tr><tr><td>')+'</td></tr></tbody>'; 
    

    주 (가입은 텍스트 연결보다 더 & 빠른 짧은) : 당신이 가지고있는 경우가 document.createDocumentFragment()

    DEMO에게 큰 테이블 사용을

    http://jsfiddle.net/5tswopt4/

    을인지 코드에 대한 몇 가지 질문 만 묻는다.

  • 관련 문제