자바 스크립트로 체스 보드 디자인하기

자바 스크립트로 체스 판을 인쇄하고 싶습니다. 그러나 생산량은 필요하지 않습니다. 그러나 콘솔이 올바르게 인쇄됩니다. 그러나 웹 페이지의 결과는 다릅니다.자바 스크립트로 체스 보드 디자인하기

또 다른 질문은 "\ n"을 사용하여 자바 스크립트 코드를 통해 웹 페이지에 새 줄을 추가 할 수없는 이유입니다. 자바는 \ n을 새로운 라인으로, html을 <br />으로 이해합니다. JavaScript에서 무엇을 사용해야합니까?

HTML :

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

    <body> 
     <pre id="testid">Hello, here will be the pattern!</pre> 
     <script src="Script1.js" type="text/javascript"></script> 
    </body> 

</html>

JS :

var chessBoard = function (length, black) { 
 
    var result = ""; 
 
    for (var line = 1; line <= length; line++) { 
 
     for (var pair = 1; pair <= length; pair++) { 
 
      result += " " + black; //\xa0\xa0\xa0 
 
     } 
 
     result += "<br />"; 
 
     for (var pair2 = 1; pair2 <= length; pair2++) { 
 
      result += black + " "; //\xa0\xa0\xa0 
 
     } 
 
     result += "<br />";   
 
    } 
 

 
    console.log(result); 
 
    return result; 
 
} 
 

 
document.getElementById("testid").innerHTML = chessBoard(4, "#");

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>test</title> 
 

 
</head> 
 

 
<body> 
 

 
    <div id="testid">Hello, here will be the pattern!</div> 
 

 
    <script src="Script1.js" type="text/javascript"></script> 
 
</body> 
 
</html>

출처

2016-10-24 Rishabh Prajapati

왜 안 되니? 왜냐하면 공백 (줄 바꿈 포함)은 html에 특별한 의미가 없기 때문입니다. 그것이 '
' 태그가있는 이유입니다. JS가'\ n'이 개행 문자라는 것을 알고 있다고해서 출력하는 환경이 그 것을 알고 있다는 것을 의미하지는 않습니다. 당신은 당신의 산출물이 어디로 갈 것인지에 대한 CONTEXT를 고려해야 만합니다. 출력 컨텍스트는 HTML 렌더링 엔진이므로 HTML 의미를 사용하여 줄 바꿈을 만들어야합니다. –

그래, html 웹 페이지에 새로운 라인이있다. 하지만 그 체스 판은 어떨까요? 단순히'# '의 행과 열을 보여줍니다. 콘솔이 체스 보드가 될 해시와 체포 사이의 완벽한 간격을 보여 주지만. 첫번째 줄이'# # # # '이면 두번째 줄은'# # # #'입니다. 콘솔은 올바르지 만 html 출력은 아닙니다. 도와주세요. ( –

당신은 웹 페이지를 생성하고 있습니다. "JS가 내가 원하는 것을하고있는 이유는 무엇입니까?"그리고 "JS 출력을 통해 웹 페이지를 올바르게 보이게 할 수 있습니까?"라고 생각하기 시작했습니다 .JS는 절대적으로 ** 아무 것도 출력을 렌더링하는 것과 관련이 있습니다 ** 브라우저가이를 처리하고 있으므로 브라우저를 협력시키는 방법을 찾아야합니다. –

임 확실하지 당신이 원하는,하지만 당신은 그것을 입력 텍스트를 표시하기 위해 사전을 사용

을

var board = ""; 
for (var y=0; y<8; y++) { 
    for (var x=0; x<8; x++) { 
     board += '#'; 
    } 
    board += "\n"; 
} 
console.log(board); 
document.getElementById("testid").innerHTML = board;

출처

2016-10-24 20:07:14 Nils

자바 스크립트로 체스 보드 디자인하기

답변

관련 문제