Javascript 在尝试以编程方式导航Webkit/Mozilla时，如何克服不同的DOM？

问题

我正在建立一个广泛使用Ajax和Javascript的网站。这个项目在Google Chrome出现之前就开始了，我需要升级在Mozilla中运行的代码，现在在Chrome中也能正常工作

我有一个问题的地方是关于弹出的DIV层，它出现了，其中显示了一个表单。基础页面还包含一个表单。每个表单都使用Ajax提交。这是弹出窗口中我遇到问题的那个

我遇到困难的Javascript在许多页面上都被使用，因此如果我能修复它，它将修复许多问题

它由一个文本字段和一个包含在表结构中的按钮组成。它没有表单标签，只有一个文本输入元素和一个标准按钮。单击该按钮会触发onClick事件，向名为addpop的函数发送必要的参数

addpop的功能是标识表单元素的所有父节点，它们都位于同一父节点中。稍后，会调用另一个脚本来标识每个元素，但在此之前，所有元素都会分解

它应该从触发事件的活动元素获取父节点。它在Firefox中工作，但是Webkit似乎有一个不同的结构，所以它在Firefox中不工作。我希望实现的是替换代码中有问题的部分

我希望这可以在不更改页面的情况下实现，而只更改Javascript，这样我就不会有成堆的页面需要处理和更新

Javascript如下所示：

function addpop(tbl, cid, e, divName, dd, elemName, res)
{
    // reset result message
    var result = document.getElementById(res);
    result.innerHTML = '<br>';

    // get form name for use in the validation
    // get the triggering element
    if (window.document.activeElement)
    {
        e = window.document.activeElement;
    }
    else
    {
        var el = window.event;
        e = e.target ? e.target : e.srcElement; // event target
    }

    // Note in comments below the result of echoing the current node name
    // in Chrome and Firefox at the points specified.

    // chrome = object HTMLBodyElement    (ff = object HTMLInputElement)

    if (e != null) { e = e.parentNode; }
    // chrome = object HTMLHtmlElement    (ff = object HTMLTableCellElement)

    if (e != null) { e = e.parentNode; }
    // chrome = object HTMLDocument       (ff = object HTMLTableRowElement)

    if (e != null) { e = e.parentNode; }
    // chrome = null                      (ff = object HTMLTableSectionElement)

    if (e != null) { e = e.parentNode; }
    // chrome = null                      (ff = object HTMLTableElement)

    // At this point, in Firefox, e=[object HTMLTableElement]
    // and I need to get Webkit to reflect the same, so that when e is passed
    // to validate_form() it will be treated the same way as it does when sent
    // by firefox. So basically I need to replace those 4 "if" statements above
    // for something with is normalized to both browsers.

str = validate_form(e);
};

为完整起见，我在下面添加了DIV的代码，其中包含弹出表单：

<div id="popCustomer">
    <a id="popCustomerX" onclick="disablePopup('popCustomer', 0);" style="cursor:pointer;">x</a>  
    <h1>Add New Customer</h1>  
    <p><font size="1.9em" face="Tahoma, Arial, Helvetica, sans-serif">&nbsp;&nbsp;Please see the help guidelines before adding a new customer.</font></p>

    <p><font size="1.9em" face="Tahoma, Arial, Helvetica, sans-serif">&nbsp;&nbsp;To add new customer, complete the form below. Don't forget to press 'Save' afterwards.</font></p>
    <br />
    <div id="result1" align="center"><br></div>

    <table width="82%" border="0" align="center" cellpadding="0" cellspacing="0">
        <tr>
          <td colspan="2" align="center" height="25" class="th">CUSTOMER DETAILS</td>
        </tr>
        <tr>
          <td colspan="2">&nbsp;</td>
        </tr>
        <tr>
          <td align="right">Customer Name*:&nbsp;</td>
          <td height="25">
              <input name="cust_comp_name" type="text" id="cust_comp_name" tabindex="1" size="33" maxlength="60" param="required" desc="Customer name" />
          </td>
        </tr>
        <tr>
            <td width="40%" height="25">&nbsp;</td>
            <td width="60%"><input type="button" name="button1" id="button1" class="button" value="Save" onclick="addpop('customers','<?=$company_id;?>',event, 'popCustomer', 'selcustomers', 'cust_comp_name', 'result1');">
            </td>
        </tr>
    </table>
</div>

我知道html包含严重贬值的元素，而且整个过程中缺乏有效的CSS使用。我在2007年开始了这个项目，当时我正在切牙，我正在把它从衣柜里拿出来，把它掸干净，看看我能不能把它完成。我不是一个专业的程序员。我有大量的清理工作要做，以达到生产标准-我知道

---

对于这四个失败的if语句的任何提示都将不胜感激。我已经花了三天的时间试图让这个部分在webkit上运行。

您对JQuery做了很多研究吗？TBH我现在正在午休，所以不能对这个问题进行太多的研究，但看起来您遇到的问题几乎正是JQuery想要解决的问题。事实上，尽管我启动了这个项目，但其他开发人员也对此做出了贡献，并引入了JQuery。我很难理解如何使用Jquery，尤其是如何使用它来替换我遇到问题的部分。虽然我会继续阅读Jquery，但是在这个问题上已经花了3天时间，但还没有取得任何进展，我开始认为我需要一些指导，但也感谢您的评论。如果您认为这就是我的答案所在，我肯定会更深入地研究Jquery。祝你午餐愉快！