Question

我正在使用php和javascript来创建我正在处理的存储库页面，到目前为止我通过jQuery生成的表格实际上并没有写入页面。所有控制台日志都可以正常工作，但没有别的。

我目前有工作，所以打开的php文件调用另一个有javascript的（和表的基础）。

调用的PHP文件如下所示：

<script>
    var h = ['Black Panther', 'Black Widow', 'Cable', 'Captain America', 'Colossus', 'Cyclops', 'Daredevil', 'Deadpool', 'Emma Frost', 'Gambit',
                'Ghost Rider', 'Hawkeye', 'Hulk', 'Human Torch', 'Iron Man', 'Jean Grey', 'Loki', 'Luke Cage', 'Moon Knight', 'Ms Marvel', 'Nightcrawler',
                'Punisher', 'Rocket Raccoon', 'Scarlet Witch', 'Spider-Man', 'Squirrel Girl', 'Storm', 'Thing', 'Thor', 'Wolverine'];

    var v = ['Black Cat', 'Blob', 'Bullseye', 'Dr. Doom', 'Dr. Octopus', 'Electro', 'Elektra', 'Gorgon', 'Green Goblin', 'Grim Reaper', 'Hood',
                'Juggernaut', 'Kingpin', 'Kurse', 'Lady Deathstrike', 'Living Laser', 'Loki', 'Madame Hydra', 'Magneto', 'Malekith', 'Mandarin',
                'Mister Sinister', 'M.O.D.O.K.', 'Moleman', 'Pyro', 'Rhino', 'Sabretooth', 'Shocker', 'Taskmaster', 'Tombstone', 'Venom', 'Wizard'];

    var e = ['Brood', 'Cliffwalker Tribe', 'Dark Elves', 'Frost Giants', 'Hand', 'Hydra', 'Latverian Drones', 'Maggia', 'Mercenary', 'N\'Garai Demons',
                'Purifier', 'Rock Trolls', 'Serpent Men', 'Storm Giants', 'Toad'];

    var i, table = $('tbody');


    for(i = 0; i < 32; i++) {
        $row = $('<tr id="row' + i + '"></tr>');
        $row.append('<td onclick="location.href=\'?s=' + v[i].toLowerCase().replace(' ','') + '\'">' + v[i] + '</td>');
        console.log( 'Villain Added: ' + v[i] );
        if(i > 29) { table.append($row);continue; }
        $row.prepend('<td onclick="location.href=\'?s=' + h[i].toLowerCase().replace(' ','') + '\'">' + h[i] + '</td>');
        console.log( 'Hero Added: ' + h[i] );
        if(i > 14) { table.append($row);continue; }
        $row.append('<td onclick="location.href=\'?s=' + e[i].toLowerCase().replace(' ','') + '\'">' + e[i] + '</td>');
        console.log( 'Enemy Added: ' + e[i] );

        table.append($row);
    }

</script>

<table class="table table-bordered table-hover">
    <thead>
        <th>Heroes</th>
        <th>Villains</th>
        <th>Enemies</th>
    </thead>

    <tbody>
    </tbody>
</table>

当我查看页面源时，页面显示确切的代码。当tbody元素应该写入所有内容时，它是空的。

我的问题是，我做错了吗？我是PHP的新手，我只是使用它来让我更容易组织我的代码。我已经尝试在创建表之后放置实际函数，将其放入文档加载函数（不应该更改任何内容），并且没有任何工作。

请帮我解决这个问题。欢呼声。

Answer 1

您必须在ready方法中包含所有js

$( document ).ready(function() {    
     // your code here
});

或者你创建一个js方法并在body的onload事件上调用它，以便在将表添加到DOM树之后执行代码。

Answer 2

当您查看页面的来源时，您将找不到新的（动态）添加元素。为了查看它们，请尝试使用document.documentElement.innerHTML，这将为您提供页面的当前html。

查看源仅显示从服务器呈现时的页面源，即页面的原始源，而不是稍后使用javascript修改的版本。

Javascript没有写到页面

2 个答案: