Question

所以我一直坚持这一点...... 我有一个带有div元素和内联框架（iframe）的HTML页面：

<!DOCTYPE html>
<head><meta charset="UTF-8"><link rel="stylesheet" type="text/css" href="/GLS_DBSearchProject/resources/css/GLS_DBSearchMainStyle.css"></head>

<div id="DebugOutput">DEBUG-OUTPUT</div>
<body align="center">
    <div class="PWContainer"><iframe class="ProgramWindow" src="index.php"></iframe></div> 
</body>


<?php

div就是我用来测试的一个盒子，因为我对JavaScript感到满意。 iframe包含一个单独的.php页面＆＃34; index.php＆＃34;。＆＃34; index.php＆＃34;的HTML完全由这个PHP代码中的函数生成：

class UserInterface {
var $ParentAppInstance;

function __construct($AppInstance){
    $this->ParentAppInstance = $AppInstance;
    $this->DrawPageHTML();
    $this->DrawDBSetDropdown();
    $this->DrawAdvancedSearchBar();
}

//Override this function to change the HTML and PHP of the UI page.
protected function DrawPageHTML(){

    echo '
    <!----Header-HTML--------------------->
    <div align="center">
      <table width="980" height="207" border="0">
        <tr>
          <td width="411"><img src="resources/logo.png" alt="" width="491" height="145" align="middle" /></td>
          <td width="411"><img src="resources/Logo2.png" width="462" height="171" alt="Logo" /></td>
        </tr>
      </table>
    </div>
    <!------------------------------------>



    <body>
        <script src=/GLS_DBSearchProject/JavaScript/UserInterface.js>
        </script>
    </body>




    ';

    echo '$AppInstanceData: ' . '<br>';
    echo '--CurrentDBSet_Str: ' . $this->ParentAppInstance->CurrentDBSet_Str;
}

protected function DrawDBSetDropdown(){
    echo '<div align="right">';
        echo '<select onchange="SwitchDatabaseSet(this.ownerDocument)" name="DBSetList" form="DBSetSelector">';
        $i = 0;
        foreach ($this->ParentAppInstance->DBSets_Arr as $DBSet){
            if($DBSet->DBSetName == 'DBSet0'){/* DO NOTHING. IE. IGNORE IT*/}
            else{
                $i++;
                echo '<option value="' . $DBSet->DBSetName . '">' . $DBSet->DBSetName . '</option>';
            }
        }
        echo '</select>';
    echo '</div>';

}

在UserInterface类的DrawDBSetDropdown（）函数中，我正在绘制一个带有变量选项的选择框。每当用户更改此选择器的状态时，我都使用＆＃34; index.php＆＃34;的HTML DOM对象调用SwitchDatabaseSet（）javascript函数。

到目前为止，一切似乎都运转正常。在这里，事情变得奇怪：

function JSTEST(){
window.alert("JS Called Successfully!!");
}

function SwitchDatabaseSet(MainPageDoc){
    window.alert(null === MainPageDoc);//1. 
    window.alert(MainPageDoc.domain);//2. 
    MainPageDoc.getElementById("DebugOutput").innerHTML = "Test";//3.
 }

结果：false。 MainPageDoc不为空。
结果：localhost。正如预期的那样，页面在localhost上运行。值得注意的是，MainPageDoc！= null。
突然MainPageDoc假定等于null;因为我得到以下错误：

未捕获的TypeError：无法设置属性＆＃39; innerHTML＆＃39;为null

* document.getElementById（）产生相同的结果。

我试图更改DebugOutput <div>的文本，但由于上述问题，它无法正常工作。
在1.和2.两者都表明MainPageDoc不为空，那么为什么我在3处得到错误？我在这里做错了什么？

Answer 1

~~我不认为这实际上是可行的，我可能错了，但这就是原因：~~ 有可能，请参阅第二次修改。

index.php生成一个html网页（让我们称之为“index_html”）

实现UserInterface.js的<script src="UserInterface.js"></script>标记在“index_html”中实现。

因此：document.getElementById（“DebugOutput”）和MainPageDoc.getElementByID（“DebugOutput”）实际上是相同的，并且它们返回null，因为它们都在寻找id =“DebugOutput”的元素。

这个<div>是在我提供的第一部分HTML代码中实现的＆lt; call that“true_index.html”＆gt;，而不是index_html。因此，两个语句都按照here所述返回null。

编辑：我认为不可能从iframe中包含的JavaScript编辑父HTML文档中的HTML元素。在我深入了解之后，我会回报。

编辑：This几乎总结了这个问题，一旦我知道自己在找什么就很容易找到。

不能getElementById（HTMLDOM对象应该为null）。我搞砸了哪里？

1 个答案: