簡體   English   中英

php中的javascript代碼無法訪問html元素。 document.getElementById無法正常運作

[英]javascript code inside php is not able to access the html element. document.getElementById is not working

php內腳本中的document.getElementById("n")無法訪問html中id="n"的段落。 該段落的內部html未被更改。 我也嘗試使用jQuery,但它也無法更改innerHTML

<?php
    $username="root";
    $password="";
    $servername="localhost";
    $database="mydb";
    $conn=mysqli_connect($servername,$username,$password,$database);
    if(!($conn)){
        die(mysqli_connect_error());
    }
    $sql="select passenger from place where source='chennai' and destination='bengaluru'";
    $result=mysqli_query($conn,$sql);
    if(mysqli_num_rows($result)>0){
        echo '<script>document.getElementById("n").innerHTML="Do Something";</script>';
    }
    mysqli_close($conn);
?>
<html>
    <head lang="en-us">
        <title>Cards</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <script src="js/materialize.min.js"></script>
        <script src="jquery-1.11.3.min.js"></script>
        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
        <link rel="stylesheet" href="css/materialize.min.css">
        <link rel="stylesheet" href="demo_css.css">
    </head>    
    <body>
        <p id="n"></p>
        <div class="container" id="con">
            <div class="card hoverable">
                <div class="card-content waves-effect waves-block waves-light">
                    <h1 class="card-title activator grey-text text-darken-4" id="content"></h1>
                </div>
                <div class="card-reveal">
                    <span class="card-title grey-text text-darken-4">Passengers<i class="material-icons right">close</i></span>
                </div>
            </div>
        </div>
    </body>
</html>

document.getElementById('n')返回任何內容的原因是,它是在加載其余html(包括您嘗試獲取的元素)之前執行的。

因此,您有幾種選擇:

  1. 將您的JavaScript放在html下方(最好在</html>結束之前)。 這樣,它將元素加載到DOM 執行。

  2. 使用一個在加載DOM時觸發的函數,並將您的js代碼放在其中。

2.1。 一種方法是使用jQuery的$(document).ready()

$(document).ready(function() {
    document.getElementById("n").innerHTML="Do Something";
}

2.2。 SO-Post中描述了一些普通的JS方式: 純JavaScript等效於jQuery的$ .ready()如何在頁面/ dom准備就緒時調用函數

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM