我有一个div,ID="ranking"我想把一些JavaScript数组的信息放在一个表格中,每一行都有两列:一个用于dados[i][25],另一个用于dados[i][26].

我的代码是这样的:

function dadosRanking(dados){
        document.getElementById("ranking").innerHTML += ''
        for(var i=1;i<6;i++)
        {
          document.getElementById("ranking").innerHTML += '';
        }
        document.getElementById("ranking").innerHTML += '
RANKING (+ PONTOS)
PONTOS
UTILIZADOR
' + dados[i][25] + '
' + dados[i][26] + '
';
}

我期望的代码是这样的:

  

    

      
RANKING (+ PONTOS)
    
  
  

    
PONTOS
    
UTILIZADOR
  
  

    

      100
    
    

      Username
    
  

但是,HTML代码脚本编写如下:

  

    

      
RANKING (+ PONTOS)
    
  
  

    
PONTOS
    
UTILIZADOR
  

"100Username"

Halcyon.. 7

每次更新innerHTML浏览器都会解析并呈现它,为此,它还会尝试"修复"您的HTML.这可能会产生意想不到的后果.而不是推送到innerHTML部分表定义,而是在单独的值中收集HTML并推送到innerHTML一次.

function dadosRanking(dados){
    var s = "";
    s += ''
    for(var i=1;i<6;i++) {
        s += '';
    }
    s += '
RANKING (+ PONTOS)
PONTOS
UTILIZADOR
' + dados[i][25] + '
' + dados[i][26] + '
';
    document.getElementById("ranking").innerHTML += s;
}

后

document.getElementById("ranking").innerHTML += ''
innerHTML变成:
RANKING (+ PONTOS)
PONTOS
UTILIZADOR




  
RANKING (+ PONTOS)
  
PONTOS
UTILIZADOR

请注意,该表已关闭!

后

document.getElementById("ranking").innerHTML += 'foobar';

innerHTML成为

..
foobar

并且在表格上下文之外无效,因此它们被删除.

后

document.getElementById("ranking").innerHTML += '';

innerHTML不会改变,因为没有做任何事情,没有要关闭的表.

每次更新innerHTML浏览器都会解析并呈现它,为此,它还会尝试"修复"您的HTML.这可能会产生意想不到的后果.而不是推送到innerHTML部分表定义,而是在单独的值中收集HTML并推送到innerHTML一次.

function dadosRanking(dados){
    var s = "";
    s += ''
    for(var i=1;i<6;i++) {
        s += '';
    }
    s += '
RANKING (+ PONTOS)
PONTOS
UTILIZADOR
' + dados[i][25] + '
' + dados[i][26] + '
';
    document.getElementById("ranking").innerHTML += s;
}

后

document.getElementById("ranking").innerHTML += ''
innerHTML变成:
RANKING (+ PONTOS)
PONTOS
UTILIZADOR




  
RANKING (+ PONTOS)
  
PONTOS
UTILIZADOR

请注意,该表已关闭!

后

document.getElementById("ranking").innerHTML += 'foobar';

innerHTML成为

..
foobar

并且在表格上下文之外无效,因此它们被删除.

后

document.getElementById("ranking").innerHTML += '';

innerHTML不会改变,因为没有做任何事情,没有要关闭的表.