0

我在使用简单的“getElementsByClass”函数循环表单上的元素时遇到问题。我必须使用这个标题：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

我也必须使用IE8。

如果我删除标题，该功能可以正常工作。我意识到错误的标签不在正确的位置，但是如果我删除它们，该功能也可以正常工作。该页面还有更多内容，但这里是精简版：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<script type="text/javascript">
    function getElementsByClass(node,searchClass,tag) {    
        var classElements = new Array();
        var els = node.getElementsByTagName(tag); // use "*" for all elements
        var elsLen = els.length;
            alert("elsLen: " + elsLen);        
        var pattern = new RegExp("\\b"+searchClass+"\\b");
        for (i = 0, j = 0; i < elsLen; i++) {          
         if ( pattern.test(els[i].className) ) {
     classElements[j] = els[i];
     j++;
     }
    }
    alert("getElementsByClass: classElements.length: " + classElements.length);
    return classElements;
    }
</script>
</head>
<body>
<table>
  <form name="formOne"> 
      <input type="button" value="click" onclick="getElementsByClass(document.formOne,'popupElement','*');" />          
      <input type="text" class="popupElement">
   </form>        

  <form name="formTwo"> 
        <table>                
        <input type="text"  class="popupElement">
        <input type="text" class="popupElement"> 
        <input type="button" value="click2" onclick="getElementsByClass(document.formTwo,'popupElement','*');" />
  </form>

formOne 上对 getElementsByClass() 的第一次调用正确触发并在警报框上显示正确的值。但是在调用 formTwo 时，该函数没有在表单上找到任何元素。

我只是想弄清楚为什么会发生这种情况，以便我可以制定解决方法。

4

1 回答 1

0

首先，我无法在 IE8 上复制它，这似乎是 IE9 的问题。

问题在于您提供的 HTML。由于某种原因，IE DOM 解析器在结束标记所在的位置混淆了，因此创建了一个空标记 (<>)。在您的情况下，表单最终是一个空标签，导致以下输出。

LOG: elsLen: 0 
LOG: getElementsByClass: classElements.length: 0

试试这个标记。

<html>
<body>
<table>
<tbody>
    <tr>
        <td>
            <form name="formOne"> 
                <input type="button" value="click" onclick="getElementsByClass(document.formOne,'popupElement','*');" />          
                <input type="text" class="popupElement" />
            </form> 
        </td>
    </tr>
    <tr>
        <td>
            <form name="formTwo"> 
                <table>
                    <tbody>
                        <tr>
                            <td>
                                <input type="text"  class="popupElement"/>
                                <input type="text" class="popupElement"/> 
                                <input type="button" value="click2" onclick="getElementsByClass(document.formTwo,'popupElement','*');" />
                            </td>
                        </tr>
                    </tbody>
                </table>
            </form>
        </td>
    </tr>
</tbody>
</table>
</body>
</html>

主要是我刚刚关闭了所有标签并遵循了HTML 4.01 表模式。

于 2013-03-25T21:39:26.627 回答