Question

我有一个遗留文档，其中包含一些其他基于模式的标记：

<td class="inputControl">
    <input id="OffsetAccountsRequired_R0" type="radio" name="OffsetAccountsRequired_N" value="Y" >Yes
        <tla:instruction type="unhide" value="OffSetAccountsApp1"></tla:instruction>
        <tla:instruction type="jscript" value="//Irrelevant JavaScript here"></tla:instruction>
    </input>
    <input id="OffsetAccountsRequired_R1" type="radio" name="OffsetAccountsRequired_N" value="N">No
        <tla:instruction type="hide" value="OffSetAccountsApp1~OffSetAccountsAppls1and2"></tla:instruction>
    </input>
    <input id="OffsetAccountsRequired_R2" type="radio" name="OffsetAccountsRequired_N" value="" checked="true" class="hiddenRadio" onclick="validate_js(this)">
        <tla:instruction type="hide" value="OffSetAccountsApp1~OffSetAccountsAppls1and2"></tla:instruction>
    </input>
</td>

以及对这些标记有效的validate_js（this）事件调用的一些可怕的JavaScript：

// Calling line - in this case 'obj' is the input control 'OffsetAccountsRequired_R2'
tlaInstructions = getInstructionTags(obj, 'tla:instruction');

function getInstructionTags(inputID,tagType){
    var coltla;
    var coltlaArray = new Array();
    tagType = tagType.toUpperCase();

        var tlaFinished = false;
        coltla = inputID.parentNode.childNodes;
        for(var i=0;i<coltla.length;i++){
            if(coltla[i].nodeName.toUpperCase() == 'INPUT' && coltla[i].id == inputID.id){
                for(var j=i;j<coltla.length;j++){
                    if(coltla[j].nodeName.toUpperCase() == tagType){
                        coltlaArray[coltlaArray.length] = coltla[j];
                    }

                    if(coltla[j].nodeName.toUpperCase() == '/INPUT'){
                        tlaFinished = true;
                        break;
                    }
                }
            }

            if(tlaFinished){
                break;
            }
        }

        return coltlaArray;
    }
}

我的任务是将此JavaScript添加到规范中，以便它可以在IE9中运行（以前只在vb6 Web浏览器控件中使用过。）

据我所知，我的JavaScript技能有限，代码的意图是从input元素中检索所有tla：指令节点。它使用行coltla = inputID.parentNode.childNodes

执行此操作

这看起来很奇怪，因为它上升了一个级别，然后下降了一个级别。我假设它这样做是因为如果你只是使用coltla = inputID.getElementsByTagName('tla:instruction')，检索tla：指令元素就不会检索节点。

是否有更简单的方法从输入控件中检索特定类型的元素数组？

Answer 1

根据HTML规范input标记不能包含任何内容。

开始标记：必填，结束标记：禁止

因此，它们会附加到input元素的父元素，因此inputID.parentNode.childNodes

的原因

这是使用nextSibling

的简化版本

function getInstructionTags(inputID,tagType){
  var coltla;
  var coltlaArray = [];
  tagType = tagType.toUpperCase();

  var tlaFinished = false;
  var next = inputID;
  while ( !tlaFinished ) {
    var next = next.nextSibling;
    tlaFinished = next == null;
    if ( !tlaFinished ) {
      var nodeName = next.nodeName.toUpperCase();
      if ( nodeName == tagType ) {
        coltlaArray.push(next);        
      } else {
        tlaFinished = (nodeName != '#TEXT');
      }
    }
  }
  return coltlaArray;
}

从输入控件中检索特定模式类型的子节点

1 个答案: