微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

JS代码在ie8里报错document.getElementById(...)为空或不是对象的解决方法

PHP中文网
发布： 2016-05-16 18:40:58
原创
1966人浏览过

ie8中对于声明文档类型更加严格如下面的代码。

<input type='text' name='os' value='Windows平台' style='width:100px' /> 
<script type="text/javascript"> 
                function osdo(str){ 
                document.getElementById("os").value=str; 
                } 
                </script> 
<input name="ostmp" type="radio" value="" onclick="osdo('')" />清空 
<input name="ostmp" type="radio" value="Windows平台" onclick="osdo('Windows平台')" /> 
Windows平台 <input name="ostmp" type="radio" value="" onclick="osdo('S60v2')" />S60v2 
<input name="ostmp" type="radio" value="" onclick="osdo('S60v3')" />S60v3 
<input name="ostmp" type="radio" value="" onclick="osdo('CHM')" />CHM 
<input name="ostmp" type="radio" value="" onclick="osdo('PDF')" />PDF 
<input name="ostmp" type="radio" value="" onclick="osdo('PPT')" />PPT 
<input name="ostmp" type="radio" value="" onclick="osdo('DOC')" />WORD 
<input name="ostmp" type="radio" value="" onclick="osdo('EXCEL')" />EXCEL
 
<input name="ostmp" type="radio" value="" onclick="osdo('asp')" />asp 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+access')" />asp+access 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+sqlserver')" />asp+sqlserver 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+sql/access')" /> 
asp+sql/access <strong>php源码</strong> 
<input name="ostmp" type="radio" value="" onclick="osdo('php')" />php 
<input name="ostmp" type="radio" value="" onclick="osdo('php+mysql')" /> 
php+mysql<input name="ostmp" type="radio" value="" onclick="osdo('jsp')" />jsp <strong>asp.net源码</strong> 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net')" />asp.net 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+access')" />asp.net+access 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+sql')" />asp.net+sql 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+sql/access')" />asp.net+sql/access
登录后复制

可以看到这段代码在ie7与ie8中都是可以运行的，下面的代码我们加入声明文档

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
登录后复制

加了上面的文档类型声明。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
运行环境： 
<input type='text' name='os' value='Windows平台' style='width:100px' /> 

<script type="text/javascript"> 
                function osdo(str){ 
                document.getElementById("os").value=str; 
                } 
                </script> 
<input name="ostmp" type="radio" value="" onclick="osdo('')" />清空 
<input name="ostmp" type="radio" value="Windows平台" onclick="osdo('Windows平台')" /> 
Windows平台 <input name="ostmp" type="radio" value="" onclick="osdo('S60v2')" />S60v2 
<input name="ostmp" type="radio" value="" onclick="osdo('S60v3')" />S60v3 
<input name="ostmp" type="radio" value="" onclick="osdo('CHM')" />CHM 
<input name="ostmp" type="radio" value="" onclick="osdo('PDF')" />PDF 
<input name="ostmp" type="radio" value="" onclick="osdo('PPT')" />PPT 
<input name="ostmp" type="radio" value="" onclick="osdo('DOC')" />WORD 
<input name="ostmp" type="radio" value="" onclick="osdo('EXCEL')" />EXCEL
 
<input name="ostmp" type="radio" value="" onclick="osdo('asp')" />asp 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+access')" />asp+access 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+sqlserver')" />asp+sqlserver 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+sql/access')" /> 
asp+sql/access <strong>php源码</strong> 
<input name="ostmp" type="radio" value="" onclick="osdo('php')" />php 
<input name="ostmp" type="radio" value="" onclick="osdo('php+mysql')" /> 
php+mysql<input name="ostmp" type="radio" value="" onclick="osdo('jsp')" />jsp <strong>asp.net源码</strong> 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net')" />asp.net 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+access')" />asp.net+access 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+sql')" />asp.net+sql 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+sql/access')" />asp.net+sql/access
登录后复制

发现 提示document.getElementById(...) 为空或不是对象的解决方法
如果页面中既有文档声明，因为用div+css布局的时候，声不声明文档，页面的一些地方都不一样。
可以在head中添加下面的代码

代码小浣熊
代码小浣熊

代码小浣熊是基于商汤大语言模型的软件智能研发助手，覆盖软件需求分析、架构设计、代码编写、软件测试等环节

代码小浣熊 51
查看详情 代码小浣熊 
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
登录后复制

完整的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> 
运行环境： 
<input type='text' name='os' value='Windows平台' style='width:100px' /> 

<script type="text/javascript"> 
                function osdo(str){ 
                document.getElementById("os").value=str; 
                } 
                </script> 
<input name="ostmp" type="radio" value="" onclick="osdo('')" />清空 
<input name="ostmp" type="radio" value="Windows平台" onclick="osdo('Windows平台')" /> 
Windows平台 <input name="ostmp" type="radio" value="" onclick="osdo('S60v2')" />S60v2 
<input name="ostmp" type="radio" value="" onclick="osdo('S60v3')" />S60v3 
<input name="ostmp" type="radio" value="" onclick="osdo('CHM')" />CHM 
<input name="ostmp" type="radio" value="" onclick="osdo('PDF')" />PDF 
<input name="ostmp" type="radio" value="" onclick="osdo('PPT')" />PPT 
<input name="ostmp" type="radio" value="" onclick="osdo('DOC')" />WORD 
<input name="ostmp" type="radio" value="" onclick="osdo('EXCEL')" />EXCEL
 
<input name="ostmp" type="radio" value="" onclick="osdo('asp')" />asp 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+access')" />asp+access 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+sqlserver')" />asp+sqlserver 
<input name="ostmp" type="radio" value="" onclick="osdo('asp+sql/access')" /> 
asp+sql/access <strong>php源码</strong> 
<input name="ostmp" type="radio" value="" onclick="osdo('php')" />php 
<input name="ostmp" type="radio" value="" onclick="osdo('php+mysql')" /> 
php+mysql<input name="ostmp" type="radio" value="" onclick="osdo('jsp')" />jsp <strong>asp.net源码</strong> 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net')" />asp.net 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+access')" />asp.net+access 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+sql')" />asp.net+sql 
<input name="ostmp" type="radio" value="" onclick="osdo('asp.net+sql/access')" />asp.net+sql/access
登录后复制

大家都在看：

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。

下载
来源：php中文网
收藏 点赞
上一篇：javascript 加入收藏、设为首页(IE,firefox兼容脚本之家版)_javascript技巧 下一篇：Exitjs获取DataView中图片文件名_extjs
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
作者最新文章
最新问题
Puppeteer点击难题：利用通用选择器与页面内点击解决动态UI交互 本文旨在解决Puppeteer自动化脚本在动态网页中点击元素失败的问题。核心挑战在于目标元素的CSS类名可能不稳定或频繁变动，导致传统选择器失效。解决方案建议采用更具鲁棒性的通用属性选择器，并结合element.evaluate(b=>b.click())方法，在浏览器页面上下文中直接触发点击事件，从而提高自动化脚本的稳定性和成功率，尤其适用于处理复杂的JavaScript事件处理逻辑。
2025-11-10 15:15:23
405
Angular 应用中多查询参数过滤的实现指南 本文详细介绍了在Angular应用中，如何优雅且高效地处理多个查询参数进行数据过滤。通过定义类型安全的过滤接口、优化服务层逻辑以动态构建HttpParams，以及在组件层管理和响应用户输入，解决了因类型定义不当导致的错误，并提供了实现多条件搜索功能的最佳实践，确保代码的健壮性和可维护性。
2025-11-10 15:12:12
255
解决PHP中$_POST无法获取表单提交数据的常见问题 在PHPWeb开发中，当点击提交按钮时，$_POST全局变量未能如预期捕获表单数据或按钮名称，这通常是由于HTML表单结构不正确导致的。核心问题在于，表单元素（包括输入字段和提交按钮）必须被包裹在一个带有method="post"属性的标签内，浏览器才能通过POST请求将数据发送到服务器，从而使PHP的$_POST超全局变量能够访问这些数据。
2025-11-10 15:07:12
773
在React/JSX组件中声明和使用自定义HTML标签 在React/JSX中直接使用非标准HTML标签（如SliderRevolution的rs-fullwidth-wrap）会导致TypeScript报错，因为它不识别这些标签。本文将详细介绍如何通过在全局JSX.IntrinsicElements接口中正确声明这些自定义标签，从而解决“Property‘rs-fullwidth-wrap’doesnotexistontype‘JSX.IntrinsicElements’”错误，确保自定义标签在React组件中能被TypeScript正确识别和使用
2025-11-10 15:05:50
196
Svelte组件自定义事件处理：以Carbon DataTable为例 讲解如何在Svelte组件中正确监听和处理自定义事件，特别关注carbon-components-svelte库的DataTable组件。通过on:指令直接在组件上绑定事件处理函数，避免了传统DOM事件监听的常见误区，确保事件能被正确捕获并处理，从而实现组件间的有效交互。
2025-11-10 15:05:01
120
iOS设备上绕过HTML5音频自动播放限制的实现策略 在iOS设备上，由于用户交互策略，HTMLAudioElement.play()方法在未经用户直接操作时会受限，导致后续音频无法自动播放并抛出NotAllowedError。本教程将详细介绍一种有效的解决方案：通过在首次用户交互后，对所有目标音频元素执行一次play()紧接pause()操作，预加载音频资源，从而解除后续程序化播放的限制，实现流畅的音频体验。
2025-11-10 15:03:08
887
动态嵌入Google地图：解决Angular中的安全信任问题 本教程详细介绍了如何在Angular应用中动态嵌入Google地图，并解决常见的“unsafevalue”安全错误。文章深入解析了Angular的安全机制，特别是XSS保护，并提供了使用DomSanitizer服务的解决方案。通过具体代码示例，演示了如何正确地构建地图URL并将其标记为安全资源，确保地图功能正常显示。
2025-11-10 15:01:08
508
React useState 异步更新与事件处理最佳实践 本文深入探讨ReactuseState钩子的异步更新机制，解释为何在状态设置后立即访问可能获取到旧值。我们将重点介绍在事件处理中如何正确获取当前输入值，强调使用event.target.value而非直接DOM操作，并提供代码示例与注意事项，帮助开发者避免常见陷阱，编写更健壮的React应用。
2025-11-10 14:53:20
779
React JS应用中外部环境变量的配置与访问指南 本教程详细介绍了如何在ReactJS应用中配置和访问外部环境变量。核心在于遵循REACT_APP_命名约定，并通过process.env对象在代码中安全地获取这些变量。文章还提供了示例代码，并强调了在添加新变量后重启应用的重要性，确保开发者能够高效且规范地管理前端配置。
2025-11-10 14:53:01
441
AWS SDK for JavaScript S3操作超时机制的优化与实践 在AWSSDKforJavaScript中，httpOptions.timeout配置在处理S3操作时可能表现出不稳定的超时行为，导致请求长时间挂起而不触发预期错误。本文将深入探讨这一问题，并提供一个更可靠的解决方案：通过结合使用AWS.Request对象的abort()方法和JavaScript的setTimeout()函数，实现对S3请求的精确控制，确保即使在httpOptions.timeout失效的情况下也能强制中断请求，从而提高应用程序的健壮性。
2025-11-10 14:48:12
631
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部