JS错误:对象不支持getElementsByClassName

本人遇到一个非常奇怪的错误。一个页面上不支持documentByClassName,这个页面是使用ifram嵌套在一个父页面里面.上图如下:
网页源代码:
嵌套的页面:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
方案信息
</title>
    <base target="_self">
    <link href="../../Css/TabPage/TabPage.css" rel="stylesheet" />
    <script type="text/javascript">
        function tabSelect(obj, pageid) {
            obj.className = "Tab TabSelect";
            var objs = document.getElementsByClassName("Tab");
            var contentObjs = document.getElementsByClassName("TabContent");
            for (var i = 0; i < objs.length; i++) {
                var tabObj = objs[i];
                if (obj != tabObj) {
                    tabObj.className = "Tab TabNoSelect";
                }
            }
            var page = document.getElementById(pageid);
            for (var i = 0; i < contentObjs.length; i++) {
                var contentObj = contentObjs[i];
                if (contentObj.id == page.id) {
                    contentObj.className = "ShowDiv TabContent";
                }
                else
                    contentObj.className = "HideDiv TabContent";
            }
        }
    </script>
</head>
<body>
    <form method="post" action="Default.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE0MDkxNzYwNDNkZCHI9aYPq5oEcOhu57Q+1l8npPTAOrJwNqfs8n6o0UIz" />
</div>        <div>
            <table align="center" border="0" cellpadding="0" cellspacing="0" width="98%" class="Td_diwen">
                <tr>
                    <td style="height: 38px">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%">
                            <tr>
                                <td class="frame02_topleft"></td>
                                <td class="frame02_topcenter" id="navTd">&nbsp;》当前功能：方案信息
                                </td>
                                <td class="frame02_topright"></td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
            <table style="width: 100%" cellspacing="0px">
                <tr>
                    <td class="TabMargin"></td>
                    <td class="Tab TabSelect" onclick="tabSelect(this,'Page1')">专项方案信息</td>
                    <td class="Tab TabNoSelect" onclick="tabSelect(this,'Page2')">干预措施</td>
                    <td class="Tab TabNoSelect" onclick="tabSelect(this,'Page3')">综合评价</td>
                    <td class="TabRemaining"></td>
                </tr>
            </table>
            <div id="content" class="TabContentFram">
                <div id="Page1" class="ShowDiv TabContent">
                    <iframe width="100%" height="600px" style="border: 0px none red" src="FileInfo.aspx"></iframe>
                </div>
                <div id="Page2" class="HideDiv TabContent">
                    Page2
                </div>
                <div id="Page3" class="HideDiv TabContent">
                    Page3
                </div>
            </div>
        </div>
    </form>
</body>
</html>
js报错asp.net