对包含的 DOM 元素进行 Javascript 操作答案

【问题标题】：Javascript Manipulation on included DOM element对包含的 DOM 元素进行 Javascript 操作
【发布时间】：2013-06-10 15:44:26
【问题描述】：

基本上我所做的是根据经典 ASP 中的下拉选择动态加载外部 HTML 文件。对于我为之工作的人来说，这是一个旧系统，所以除了弄清楚这一点之外，我没有太多选择。包含的 HTML 只是这样的数据表；

<table cellspacing="0" cellpadding="0" style="vertical-align:top; width:100%; ">
<tr style="line-height:14px;" >
<td width="150"><b style="color:#888888;">Symbol<b></td>
<td ><b style="color:#888888;">Security</b></td>
<td width="150" style="text-align:right;"><b style="color:#888888;">Amount</b></td>
<td width="150" style="text-align:right;"><b style="color:#888888;">Mkt Value</b>    </td>
<td width="150" style="text-align:right;"><b style="color:#888888;">Est.Next Date</b></td>
</tr>
<tr style="line-height:14px; background-color: #f0f0e8;">
<td>QPRMQ</td>
<td>BANK DEPOSIT SWEEP PRGRAM FDIC ELIGIBLE</td>
<td style="text-align:right;">100.00%</td>
<td style="text-align:right;">$191.77</td>
<td style="text-align:right;" id="NextSWPDate">11/15/2010</td>
</tr>
</table>

我想在 ID 为“NextSWPDate”的 TD 元素上运行一个函数，但由于这是“包含”的 html，我只收到了错误；

无法设置属性“innerHTML”的值：对象为空或未定义

我的函数现在只是通用的，我试图对对象进行任何操作，在我得到那个集合之后，我可以快速轻松地编写真正的逻辑。

    function SetNextSWPDate(){
document.getElementById("NextSWPDate").innerHTML = "this is a test";
}

谢谢你，尼克G

【问题讨论】：

html文件加载后是否调用该函数？你如何加载这个外部 html 文件？
一切加载完毕后，我在 document.ready(){} 函数中调用了外部函数。外部 HTML 文件也通过 document.ready() 中的 .load() 函数加载，但在我的 SetNextSWPDate() 函数之前。 .load() 用于页面中的
。
好的，所以你必须为你的 jQuery.load 函数实现一个回调函数： $("#yourDiv").load("youExternalFile",function(){//你的东西在这里... });见api.jquery.com/load/#callback-function
我仍然无法让它工作，这是我在 document.ready() 函数中的 .load() 调用 $("document").ready( function(){ $ ("#PipData").load('/backoffice/Prospects/App360/pageFragments/pipswp/218145_pip.html'); $("#SwpData").load('/backoffice/Prospects/App360/pageFragments/pipswp/218145_swp .html',function(){ $("#NextSWPDate").innerHTML = "这是一个测试"; }); });
我想通了，谢谢你的帮助，不知道如何标记你的答案

The property is read/write for all objects except the following, for which it is read-only: COL, COLGROUP, FRAMESET, HEAD, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR. Colin's work-around (setting innerText on the td instead of innerHTML on the tr) is a good one in your case. If your needs become more complex, you'll have to resort to The Table Object Model.