当试图从javascript获取数据，然后在HTML中显示它时出错

Error when trying to get data from javascript and then showing it in HTML

本文关键字：HTML 显示 出错 然后 javascript 数据 获取      更新时间：2023-09-26

嗨，我从url获取数据，然后将其存储到变量中，然后使用document.getElementById()在html中显示数据。但由于某些原因，我一直得到这个错误

"[Error] TypeError: null不是一个对象(求'document.getElementById("firstname") ")。innerHTML = fname')全球代码"

感谢
<script type="text/javascript">
    var fname = ""
    var lname = ""
    var user = ""
    var pass = ""
    var email = ""
    var con = ""
    var group = ""
    var uri_dec = ""
    var uri_dec1 = ""
    $.urlParam = function(name){
        var results = new RegExp('['?&]' + name + '=([^&#]*)').exec(window.location.href);
        if (results==null){
           return null;
        }
        else{
           return results[1] || 0;
        }
    }
    fname = $.urlParam('fname');
    lname = $.urlParam('lname');
    user = $.urlParam('user');
    email = $.urlParam('email');
    con = $.urlParam('con');
    group = $.urlParam('group');
    uri_dec = decodeURIComponent(con);
    uri_dec1 = decodeURIComponent(group);
    console.log($.urlParam('fname'));
    console.log($.urlParam('lname'));
    console.log($.urlParam('user'));
    console.log($.urlParam('email'));
    console.log($.urlParam('con'));
    console.log($.urlParam('group'));
    document.getElementById("firstname").innerHTML = fname
    document.getElementById("lastname").innerHTML = lname;
    document.getElementById("username").innerHTML = user
    document.getElementById("email").innerHTML = email
    document.getElementById("country").innerHTML = uri_dec
    document.getElementById("group").innerHTML = uri_dec1
    </script>
    <p align="center" id="firstname"></p>
    <p align="center" id="lastname" class="lastname"></p>
    <p align="center" id="username" class="username"></p>
    <p align="center" id="email" class="email"></p>
    <p align="center" id="country" class="contry"></p>
    <p align="center" id="group" class="group"></p>

尝试将innerHTML改为innerText

正如@ sciifthief所提到的，您的脚本在html加载之前被执行。你需要在html标签之前包含你的脚本，或者在html加载后使用'document ready'函数来执行脚本。

//Using Jquery
$(document).ready(function(){
    //your script here
});
//Using vanilla Javascript
document.addEventListener("DOMContentLoaded", function(event) { 
    //your script here
});
相关文章：