나는 어떻게해야 큰 묻는 innerHTML을 과용 및

function promptuj() { 
 
    this.x = prompt("How big should be your multiplication table?"); 
 
    document.getElementById("keks").innerHTML = tabliczka(this.x); 
 
} 
 

 
function tabliczka() { 
 
    document.getElementById("keks").innerHTML += "<table border=\"1\">"; 
 
    for (i = 1; i <= this.x; i++) { 
 

 
    document.getElementById("keks").innerHTML += "<tr><td>" + i + "</td>"; 
 
    for (j = 1; j <= this.x; j++) { 
 
     if (j != 1) { 
 
     document.getElementById("keks").innerHTML += "<td>" + j * i + "</td>"; 
 
     } 
 

 
    } 
 
    document.getElementById("keks").innerHTML += "</tr>"; 
 
    } 
 
    document.getElementById("keks").innerHTML += "</table>"; 
 
}

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <title>Demo</title> 
 
    <meta charset="utf-8"> 
 
</head> 
 

 
<body> 
 
    <input type="button" onclick="promptuj()" value="Promptonto" /> 
 
    <div id="keks"></div> 
 

 
</html>

이 짧은 거시기 프롬프트 버튼으로 구구단을위한 정의되지 않은 얻을했습니다 수 있습니다. 그러나 임의의 숫자를 지정하면 테이블 대신 정의되지 않은 값이 반환됩니다. 그 전에는 document.getElementById ("keks") 대신 document.write (무엇이든)를 사용했습니다. innerHTML + = 그리고 그것은 효과가있었습니다.

편집 : <body>을 닫지 않았지만 도움이되지 않은 것으로 나타났습니다. (이 방법 자바 스크립트의 작품이다) 당신의 tabliczka 기능은 원래 아무것도 반환하지 않기 때문에 당신은 정의되지 않은 본

<script type="text/javascript"> 

     function promptuj() { 
      window.x=prompt("How big should be your multiplication table?"); 
      document.getElementById("keks").innerHTML = tabliczka(window.x); 
     } 

     function tabliczka(x) { 

      var htmlString = ""; 

      htmlString += "<table border=\"1\">"; 
      for (i=1; i<=window.x; i++) { 

       htmlString += "<tr><td>" + i + "</td>"; 
       for (j=1; j<= x; j++) { 
        if (j!=1) { 
        htmlString += "<td>" + j*i + "</td>"; 
        } 

       } 
       htmlString += "</tr>"; 
      } 
      htmlString += "</table>"; 

      return htmlString; 
     } 



    </script>

, 그래서 자바 스크립트는 암시 적으로 그것을 호출에서 정의되지 않은 반환

출처

2016-09-18 Irevall

는'.innerHTML + ='절대 사용하지 마십시오! – Oriol

@Oriol 그럼 대신 무엇을 사용해야합니까? : | – Irevall

@Andrew L. 방금 함수 외부에서 정의 했으므로 중요하지 않습니다. document.write()를 사용할 때 정의하지 않고 작동했습니다. – Irevall

같은 것을보십시오.

기본적으로 tabliczka가 올바르더라도 기본적으로 "keks"div에 innerHTML 변경 사항이 적용되어 promptuj 함수가 정의되지 않은 tabliczka의 결과와 함께 ".keks"에 최종 .innerHTML을 수행했습니다.

그냥 너무 빨리 당신이 내가 알 수있는 것으로부터 정의되지 않은 것을 보았습니다.

출처

2016-09-18 19:04:52 klikas

그래서 promptuj()는 tabliczka()에서 일부 문자열/값을 원했고 아무 것도 발견하지 못했습니다. tabliczka()는 HTML에 항목을 추가하기를 원했기 때문에? – Irevall

원래 솔루션이 작동하지 않는 이유에 대한 분석을 한 후 +1하고 싶습니다.하지만 가난한'this.x' 솔루션과 잘못된 함수 인수 접근법을 유지해 왔기 때문에 준비가 안 됐습니다. 아직 이것을 보증하지 마십시오 :) –

네, 기본적으로 맞습니다. javascript에서 함수 호출은 명시 적으로 무언가를 반환하지 않는 한 기본적으로 undefined를 반환합니다. 예를 들어, myFunction() {/ * do nothing * /} 함수가있는 경우 myFunction()을 사용하여 호출하면 정의되지 않습니다. 반면 함수 myFunction {return 0; }, 호출 할 때 0을 반환합니다. 코드에서 다음을 수행했습니다. document.getElementById ("keks"). innerHTML = tabliczka (this.x); "div"keks "에 tabliczka가 반환하는 것은 무엇이든 넣습니다."tabliczka는 정의되지 않은 상태로 돌아 왔습니다. 그래서 정의되지 않은 것을 보았습니다. – klikas

promptuj에서 innerHTML을 tabliczka이 반환하는 값으로 설정했기 때문에 정의되지 않습니다. 그러나 tabliczka은 명시 적으로 아무 것도 반환하지 않으므로 undefined을 반환 한 것과 같습니다.

대신 tabliczka은 innerHTML으로 설정 될 HTML 문자열을 반환해야합니다.

또한 .innerHTML +=을 사용하지 마십시오. 문자열을 먼저 연결하고 끝에 innerHTML을 할당하십시오. .innerHTML = "<table>"을 사용하는 경우 파서는 .innerHTML += "</table>"을 기다리지 않고 테이블을 자동으로 닫습니다. 그러면 내용이 표 바깥에 삽입됩니다. 여기서는 관련이 없지만 .innerHTML +=은 내부 데이터 (예 : 이벤트 리스너.

function promptuj() { 
 
    var x = prompt("How big should be your multiplication table?"); 
 
    document.getElementById("keks").innerHTML = tabliczka(x); 
 
} 
 
function tabliczka(x) { 
 
    var str = "<table>"; 
 
    for (var i=1; i<=x; i++) { 
 
    str += "<tr>"; 
 
    for (var j=1; j<=x; j++) { 
 
     str += "<td>" + j*i + "</td>"; 
 
    } 
 
    str += "</tr>"; 
 
    } 
 
    str += "</table>"; 
 
    return str; 
 
}

table { 
 
    border-collapse: collapse; 
 
} 
 
td { 
 
    text-align: center; 
 
    border: 1px solid; 
 
}

<input type="button" onclick="promptuj()" value="Promptonto" /> 
 
<div id="keks"></div>

출처

2016-09-18 19:05:21 Oriol

그래서 실제로 innerHTML을 과용 했습니까? : P – Irevall

이것은 깨끗하고 좋은 해결책 이었지만'.innerHTML + = '부분이 실제로 문제의 원인 이었습니까? 성능 때문에 그다지 나쁜 생각이 아닌가? –

@PeterHerdenborg 글쎄, 몇 가지 문제가있었습니다. 'tabliczka'가 아무 것도 반환하지 않았기 때문에 그 결과는 정의되지 않았습니다. 그러나'.innerHTML + ='는 성능에 좋지 않다. '.innerHTML = "

"'을 사용하면 파서는'.innerHTML + = "

"을 기다리지 않고 자동으로 닫습니다. 그러면 내용이 표 바깥에 삽입됩니다. 여기서는 관련이 없지만 '.innerHTML + ='은 내부 데이터를 삭제합니다. 이벤트 리스너. – Oriol

나는 어떻게해야 큰 묻는 innerHTML을 과용 및

답변

관련 문제