`
zhouyrt
  • 浏览: 1184378 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

document.write/writeln非IE/Opera浏览器中可能会造成元素获取不到

    博客分类:
  • BUG
阅读更多

document.write/writeln在几年前的代码中见的比较多,多数情况下各浏览器表现一致。

 

<!DOCTYPE html>
<html>
<head></head>
<body>
	<script>
		document.write('<div id="wraper"></div>');
		var obj = document.getElementById('wraper');
		alert(obj);
	</script>
</body>
</html>

 

 

script标签写在body中,先write一个div,通过document.getElementById获取该元素。所有浏览器中都弹出了该div的信息框,证明这么写是支持的。

如果不小心把script写在head中呢,各个浏览器中行为将不一致,你可以测试下?下面代码将重现该Bug,

 

index.html

 

<!DOCTYPE html>
<html>
<head></head>
<body>
<script src="a.js"></script>
</body>
</html>

 

 

a.js

 

document.write('<script src="b.js"></script>');
document.write('<div id="wraper"></div>')
alert(document.getElementById('wraper'));
 

b.js

 

b.js中可以不写任何代码
 

index.html,在IE/Opera中会弹出信息框显示该div元素,其它浏览器均为null。

当然,罪魁祸首就是 document.write('<script src="b.js"></script>');

b.js中没写任何代码,但它的确影响了非IE/Opera浏览器,很难理解为何不显示div而是null。

如果把该句删除,所有浏览器都显示div。

猜测可能是是a.js中第一个document.write覆盖了后面的document.write。测试后发现也不对,其它不变,把a.js改为

document.write('<p>hello</p>');
document.write('<div id="wraper"></div>')
alert(document.getElementById('wraper'));


这次write输出div[id=wraper]前也有一个write,但write的是p元素而非script元素,所有浏览器中表现一致都弹出div显示框而非null。


慎用document.write/writeln!

 

 

 

 

分享到:
评论

相关推荐

    各浏览器对document.getElementById等方法的实现差异解析

    - `document.write`和`document.writeln`在IE6/7/8中可以直接调用,而在其他浏览器中会抛出错误。这是因为这两个方法在非初始文档加载期间在其他浏览器中是不可用的。 - `location.reload`和`history.go`同样在IE6/7...

    图库新版jQuery焦点图 JS代码

    //document.writeln ('&lt;dd&gt;06月21日 修复IE6下兼容问题&lt;/dd&gt;'); //document.writeln ('&lt;dd&gt;06月01日 懒人图库2012新版上线&lt;/dd&gt;'); //document.writeln ('&lt;dd&gt;05月26日 新增北方网通服务器&lt;/dd&gt;'); //document....

    基于 OpenCV 的魔兽世界钓鱼机器人

    基于 OpenCV 的魔兽世界钓鱼机器人

    供应链管理中信息共享问题的研究.docx

    供应链管理中信息共享问题的研究

    青春文学中的爱情观呈现.doc

    青春文学中的爱情观呈现

    分布式光伏储能系统的优化配置方法 附Matlab代码.rar

    1.版本:matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点:参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象:计算机,电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。

    Delphi 12.3 控件之XLSReadWriteII6.02.01.7z

    XLSReadWriteII6.02.01.7z

    图解系统-小林coding-v1.0.rar

    图解系统-小林coding-v1.0

    【光伏功率预测】基于EMD-PCA-LSTM的光伏功率预测模型 附Matlab代码.rar

    1.版本:matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点:参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象:计算机,电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。

    漫画作品与乌托邦理想追求.doc

    漫画作品与乌托邦理想追求

    江苏建筑消防设施维护保养规程.rar

    江苏建筑消防设施维护保养规程.rar

    基于交互式可视化的Transformer模型注意机制探索工具-DODRIO及其应用

    内容概要:论文介绍了一款名为DODRIO的交互式可视化工具,帮助自然语言处理(NLP)研究人员和从业者解析基于转换器架构的语言模型内部工作机理。DODRIO整合了概述图与详尽视图,支持用户比较注意力权重与其输入文本的句法结构和语义特征。具体而言,它包含了依赖关系视图(Dependency View)、语义关注图(Semantic Attention Graph)以及注意力头概览(Attention Head Overview),并利用不同的图形展示方法使复杂的多层多头转换器模型中的注意力模式更容易理解和研究。 适用人群:适用于从事深度学习、自然语言处理的研究人员和技术从业者;尤其适合对基于变换器架构的大规模预训练语言模型感兴趣的开发者们。 使用场景及目标:DODRIO用于探索转换器模型各层级之间的联系、验证已有研究成果,同时激发新假设形成。具体使用时可以选择特定数据集中的句子作为样本输入,观察不同注意力机制如何响应文本内容的变化。此外,还可以用来对比精简版本DistilBERT的表现,评估其相对全量模型BERT的优势与不足。 其他说明:DODRIO为开源项目,提供web端实施方式,使得

    基于机器学习的疾病数据集分析

    该代码使用scikit-learn的乳腺癌数据集,完成分类模型训练与评估全流程。主要功能包括:数据标准化、三类模型(逻辑回归、随机森林、SVM)的训练、模型性能评估(分类报告、混淆矩阵、ROC曲线)、随机森林特征重要性分析及学习曲线可视化。通过`train_test_split`划分数据集,`StandardScaler`标准化特征,循环遍历模型进行统一训练和评估。关键实现细节包含:利用`classification_report`输出精确度/召回率等指标,绘制混淆矩阵和ROC曲线量化模型效果,随机森林的特征重要性通过柱状图展示,学习曲线分析模型随训练样本变化的拟合趋势。最终将原始数据和预测结果保存为CSV文件,便于后续分析,并通过matplotlib进行多维度可视化比较。代码结构清晰,实现了数据处理、模型训练、评估与可视化的整合,适用于乳腺癌分类任务的多模型对比分析。

    数字化智慧园区建设实施PPT(43页).pptx

    在智慧城市建设的大潮中,智慧园区作为其中的璀璨明珠,正以其独特的魅力引领着产业园区的新一轮变革。想象一下,一个集绿色、高端、智能、创新于一体的未来园区,它不仅融合了科技研发、商业居住、办公文创等多种功能,更通过深度应用信息技术,实现了从传统到智慧的华丽转身。 智慧园区通过“四化”建设——即园区运营精细化、园区体验智能化、园区服务专业化和园区设施信息化,彻底颠覆了传统园区的管理模式。在这里,基础设施的数据收集与分析让管理变得更加主动和高效,从温湿度监控到烟雾报警,从消防水箱液位监测到消防栓防盗水装置,每一处细节都彰显着智能的力量。而远程抄表、空调和变配电的智能化管控,更是在节能降耗的同时,极大地提升了园区的运维效率。更令人兴奋的是,通过智慧监控、人流统计和自动访客系统等高科技手段,园区的安全防范能力得到了质的飞跃,让每一位入驻企业和个人都能享受到“拎包入住”般的便捷与安心。 更令人瞩目的是,智慧园区还构建了集信息服务、企业服务、物业服务于一体的综合服务体系。无论是通过园区门户进行信息查询、投诉反馈,还是享受便捷的电商服务、法律咨询和融资支持,亦或是利用云ERP和云OA系统提升企业的管理水平和运营效率,智慧园区都以其全面、专业、高效的服务,为企业的发展插上了腾飞的翅膀。而这一切的背后,是大数据、云计算、人工智能等前沿技术的深度融合与应用,它们如同智慧的大脑,让园区的管理和服务变得更加聪明、更加贴心。走进智慧园区,就像踏入了一个充满无限可能的未来世界,这里不仅有科技的魅力,更有生活的温度,让人不禁对未来充满了无限的憧憬与期待。

    Matlab实现BO贝叶斯优化-Transformer-GRU多特征分类预测的详细项目实例(含完整的程序,GUI设计和代码详解)

    内容概要:本文档介绍了基于MATLAB实现的贝叶斯优化(BO)、Transformer和GRU相结合的多特征分类预测项目实例,涵盖了详细的程序设计思路和具体代码实现。项目旨在应对数据的多样性与复杂性,提供一种更高效的多特征数据分类解决方案。文档主要内容包括:项目背景与意义,技术难点与解决方案,具体的实施流程如数据处理、模型构建与优化、超参数调优、性能评估以及精美的GUI设计;详细说明了Transformer和GRU在多特征数据分类中的应用及其与贝叶斯优化的有效结合,强调了其理论与实际应用中的价值。 适合人群:具备一定机器学习和MATLAB编程基础的研发人员,特别是从事多维数据处理与预测工作的专业人士和技术爱好者。 使用场景及目标:① 适用于金融、医疗、交通等行业,进行复杂的多维数据处理和预测任务;② 提升现有分类任务中复杂数据处理的准确度和效率,为各行业提供智能预测工具,如金融市场预测、患者病情发展跟踪、交通流量管理等。 其他说明:本文档包含了丰富的实战案例和技术细节,不仅限于模型设计本身,还涉及到数据清洗、模型优化等方面的知识,帮助使用者深入理解每一步骤背后的原理与实现方法。通过完整的代码样例和GUI界面设计指导,读者可以从头到尾跟随文档搭建起一套成熟的分类预测系统。

    Hive sql练习题,只是参考作用

    大数据的sql练习题,初级中级高级

    基于自注意力机制的序列转换模型-Transformer的提出及其应用

    内容概要:论文介绍了名为Transformer的新网络架构,它完全基于自注意力机制,在不使用递归或卷积神经网络的情况下建模输入与输出之间的全局依赖关系,尤其适用于长文本处理。通过多头自注意力层和平行化的全连接前馈网络,使得在机器翻译任务上的表现优于当时最佳模型。具体地,作者用此方法实现了对英语-德语和英语-法语翻译、句法解析等任务的高度并行化计算,并取得显著效果。在实验方面,Transformer在较短训练时间内获得了高质量的翻译结果以及新的单一模型基准。除此之外,研究人员还探索了模型变体的效果及其对于不同参数变化时性能的变化。 适用人群:从事自然语言处理领域的研究者、工程师、学生,熟悉深度学习概念尤其是编码器-解码器模型以及关注模型创新的人士。 使用场景及目标:主要适用于序列到序列(seq2seq)转换任务如机器翻译、语法分析、阅读理解和总结等任务的研究和技术开发;目标在于提高计算效率、缩短训练时间的同时确保模型性能达到或超过现有技术。 其他说明:本文不仅提出了一个新的模型思路,更重要的是展示了自注意力机制相较于传统LSTM或其他方式所拥有的优势,例如更好地捕捉远距离上下文关系的能力

    【故障诊断】一种滚动体轴承或齿轮的重复瞬态提取方法研究 附Matlab代码.rar

    1.版本:matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点:参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象:计算机,电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。

    用于平抑可再生能源功率波动的储能电站建模及评价 附Matlab代码.rar

    1.版本:matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点:参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象:计算机,电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。

    使用 KTH 数据集进行人类行为识别 附Matlab代码.rar

    1.版本:matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点:参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象:计算机,电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。

Global site tag (gtag.js) - Google Analytics