javascript - 在 html 选择选项元素中提取 xml 元素

Question

我有一个糟糕的遗留 HTML 文档，其中包含一些用于创建元数据形式的混合 XML 和一些复杂的 JavaScript 来操作所有需要升级到 IE9 的元数据。目前，我遇到了一个选择控件的问题，该控件在选项元素中包含一些额外的 XML 节点:

<select id="NoOfApplicants_Q" onchange="validate_js(this);doNoOfApplicantsChange();">
    <option value="" selected="true">Please select
        <tla:instruction type="jscript" value="$jointApplication = false;"></tla:instruction>
        <tla:instruction type="hide" value="App2Identity"></tla:instruction>
        <tla:instruction type="hide" value="App2Applicant"></tla:instruction>
    </option>
    <option value="1">One
        <tla:instruction type="jscript" value="$jointApplication = false;"></tla:instruction>
        <tla:instruction type="hide" value="App2Identity"></tla:instruction>
        <tla:instruction type="hide" value="App2Applicant"></tla:instruction>
    </option>
    <option value="2">Two
        <tla:instruction type="jscript" value="$jointApplication = true;"></tla:instruction>
    </option>
</select>

我需要使用 JavaScript 读取 tla:instruction 节点，以便我可以对它们进行一些后续处理。然而，我目前拥有的代码行没有返回任何节点:

instructions = control.options[control.selectedIndex].getElementsByTagName('tla:instruction');

如果我通过监 window 口检查 DOM，那么 control.options[control.selectedIndex] 下的唯一元素是选项中的文本元素。例如'请选择'、'一个'等

如何从所选选项中获取 tla:instruction 元素的数组/列表/集合？

更新:是否可以通过将文件作为 XML 文档打开然后从那里提取它们来提取这些文件？

其他背景:上面的简化片段是一个更大文档的一部分，该文档在我公司的旧 VB6 产品中用作电子表格。它是没有模式的混合 XML 和 HTML，并且只通过 VB6 Web Browser 显示过控制。因为 Web 浏览器控件可以很好地处理格式错误的标记并且几乎忽略了 JavaScript 错误，所以设计中固有的所有问题已经恶化了十年。

附注请注意，我不能使用 jquery，因为遗留文档由第三方控制。

p.p.s 参见 similar problem with input control here

Answer 1

我没有 VB6 Web 浏览器控件来测试与您完全相同的情况，但是使用 Firebug 在 JSFiddle 上玩了一下给了我一些想法(但显然，它在普通浏览器中不起作用)。根据您的测试/调试环境的设置方式，首先尝试计算 option 元素的子元素以查看 Javascript 是否可以远程看到它。

因此，首先尝试 control.options[control.selectedIndex].children.count，如果返回 1 或更多，则尝试遍历子集合。甚至可以查看选项元素的 childNodes 属性以查看返回的内容。

如果这些没有返回您想要的内容，我认为如果不将 XML 更改为 HTML，就没有办法做到这一点。

HTML

<select id="NoOfApplicants_Q" onchange="getChangedValue(this)">
<option value="" selected="true">Please select
    <tla:instruction type="jscript" value="$jointApplication = false;"></tla:instruction>
    <tla:instruction type="hide" value="App2Identity"></tla:instruction>
    <tla:instruction type="hide" value="App2Applicant"></tla:instruction>
</option>
<option value="1">One
    <tla:instruction type="jscript" value="$jointApplication = false;"></tla:instruction>
    <tla:instruction type="hide" value="App2Identity"></tla:instruction>
    <tla:instruction type="hide" value="App2Applicant"></tla:instruction>
</option>
<option value="2">Two
    <tla:instruction type="jscript" value="$jointApplication = true;"></tla:instruction>
</option>

JS

window.getChangedValue = function(SelectElement)
{
    var option = SelectElement.options[SelectElement.selectedIndex];
    alert("Count of Children Elements: "+option.children.length);
}

JSFiddle