首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

javascript document.write和innerHTML输出不同的值

JavaScript中的document.writeinnerHTML都是用于向HTML文档中插入内容的方法,但它们有一些区别。

document.write是一个直接的方法,它可以在页面加载时直接将内容写入到HTML文档中。它可以在任何位置使用,包括在<script>标签中,也可以在页面加载完成后使用。但是,如果在页面加载完成后使用document.write,它会覆盖整个文档,即使只是插入一小段内容。

innerHTML是一个属性,它可以用来获取或设置HTML元素的内容。通过设置innerHTML属性,可以将内容插入到指定的HTML元素中。与document.write不同,innerHTML可以在页面加载完成后使用,并且不会覆盖整个文档,而是将内容插入到指定的元素中。

总结一下:

  • document.write是一个直接的方法,可以在页面加载时或加载完成后使用,但会覆盖整个文档。
  • innerHTML是一个属性,用于获取或设置HTML元素的内容,可以在页面加载完成后使用,并且不会覆盖整个文档。

在实际应用中,根据具体的需求选择使用document.write还是innerHTML。如果需要在页面加载完成后动态地插入内容,推荐使用innerHTML,因为它更灵活且不会破坏整个文档结构。如果只是在页面加载时插入一些静态内容,可以使用document.write

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

JavaScript 原始引用讲解

这是我参与「掘金日新计划 · 10 月更文挑战」第18天,点击查看活动详情 引用相关内容 在 JavaScript 中,数据类型整体上来讲可以分为两大类:基本类型引用数据类型 基本数据类型,一共有...具体原因是因为不同对象在底层都表现为二进制,在 JavaScript 中二进制前三位都为 0 的话会被判断为 object 类型,null 二进制全部为 0,自然前三位也是 0,所以执行 typeof...但是,JavaScript 数据类型分成原始类型(primitive)复合类型(complex)两大类,作者觉得表示“无”最好不是对象。...访问方式 按访问 简单是作为不可细化进行存储使用,引用它们会转移其。...基本数据类型引用数据类型区别 参考答案: 在 JavaScript 中,数据类型整体上来讲可以分为两大类:基本类型引用数据类型 基本数据类型,一共有 6 种: string,symbol,

98210

一篇文章带你了解avaScript输出

在某些情况下,您可能需要从JavaScript代码生成输出。例如,您可能想查看变量,或向浏览器控制台写一条消息,以帮助您调试正在运行JavaScript代码中问题,等等。...一、JavaScript显示能力 JavaScript可以使用不同方法“显示”数据。 写入警报框, 使用 window.alert()。写入HTML输出 使用 document.write()。...使用 document.write() 出于测试目的,使用document.write()更方便 。 例: <!...使用 innerHTML 访问一个HTML元素, JavaScript可以使用 document.getElementById(id) 方法。...三、总结 本文基于JavaScript,介绍了常见4种输出, “显示方法” 。对每一种在实际应用时候,需要注意什么,应该怎么去运用,做了详细讲解。用丰富效果图 能够让读者更好理解。

47020

JavaScript危险函数 - HTML操作

有两种类型输入源:DirectIndirect。在接下来文章中,我们将分析直接/间接输入各种类型,以及如何利用不正确编程技术来恶意JavaScript代码造成破坏。...接收器:接收器是可以导致或影响客户端代码执行所有DOM属性,JavaScript函数其他客户端实体。...函数诸如innerHTML之类属性之间区别 document.write方法:  让我们以document.write(或document.writeln)这样函数为例来更好地解释Sink,让我们来看看这个函数例如属性...正如我们所看到document.write以直接方式运行,因为Sink写入(输出)由检查用户输入恶意代码,实际上转到以下URL:       http://示例。...将会有打印屏幕任务作为参数插入到函数中数据,虽然已经通过恶意JavaScript代码用户参数,然后函数将只无意中在有问题DOM代码中执行写操作,那么: alert(document.cookie

2.3K80

一篇文章带你了解avaScript输出

在某些情况下,您可能需要从JavaScript代码生成输出。例如,您可能想查看变量,或向浏览器控制台写一条消息,以帮助您调试正在运行JavaScript代码中问题,等等。...一、JavaScript显示能力 JavaScript可以使用不同方法“显示”数据。 写入警报框, 使用 window.alert()。写入HTML输出 使用 document.write()。...使用 document.write() 出于测试目的,使用document.write()更方便 。 例: <!...使用 innerHTML 访问一个HTML元素, JavaScript可以使用 document.getElementById(id) 方法。...要访问Web浏览器控制台,请先按F12键盘上键以打开开发人员工具,然后单击控制台选项卡。 ? 三、总结 本文基于JavaScript,介绍了常见4种输出, “显示方法” 。

51620

DOM基础知识

1.DOM介绍 DOM= Document Object Model,文档对象模型,DOM可以以一种独立于平台语言方式访问修改一个文档内容结构。...(content);//输出:这是内容部分1 document.write(‘’); document.write(val.id);//输出id document.write(‘’)...; val.id=’test’;//设置id为test document.write(val.id); document.write(‘’); val.title=’新标题’; document.write...(0).innerHTML);//这样就会获取到第一个li内容 document.write(tag.length);//获取到li总个数 结果就是 第一个li标签3 3.3getElementsByTagName...value);//这样就会获取到第一个name=addininput标签value 这样就会输出为空 3.4getAttribute()获取元素中某一个属性 上面讲到getElementById

73140

C语言共用体成员输出与赋值时不同原因

共用体成员输出与赋值时不同原因在使用C语言共用体时,如果成员输出与之前定义共用体变量时候所赋值不同,那么很可能是因为定义共用体变量时候,为共用体多个成员赋值造成。...因为共用体虽然允许在同一个内存位置上存储不同数据类型变量,但是任何时候都只能有一个成员存储,也就是说,当共用体内某一个成员被赋值了,那么其它成员之前所赋就会丢失或损坏,这就是造成共用体成员输出与赋值时不同原因了...解决方法分开为C语言共用体成员赋值,即什么时候使用就什么时候赋值,确切来说,要使用一个新共用体成员时,就应该为其赋值。...c; c.id = 2; printf("%d\n",c.id); c.salary = 8000; printf("%d\n",c.salary);}原文:C语言共用体成员输出与赋值时不同解决方法

16221

听说你对 JavaScript输出挺熟?

前言 在 JavaScript 中,不像 Java 等语言,它没有任何打印或者输出方法,通常使用如下 4 种方式来输出数据。...使用 window.alert() 用于弹出警告框 使用 document.write() 将内容写入到 HTML 文档中 使用 innerHTML 写入到 HTML 元素 使用 console.log...但是需要注意是,如果 document.write() 是其他内容同时在内容加载完之前加载,则可以其他内容一起显示。...image.png image.png innerHTML JavaScript 如果要访问某一个 HTML 元素,此时可以使用 document.getElementById(id) 方法,然后就可以利用...中输出有关内容了,虽然不像 Java 那样有类似 System.out.println() 方法来进行打印输出,但利用上述 4 种方式,也能基本满足日常开发中需求了。

40620

前端学习——JavaScript基础(一)

JavaScript document.write() 直接写入HTML输出流 x=document.getElementById(“demo”); // 找到元素 x.innerHTML=“Hello...使用 document.write() 方法将内容写到 HTML 文档中。 使用 innerHTML 写入到 HTML 元素。 使用 console.log() 写入到浏览器控制台。...typeof 操作符来检测变量数据类型 JavaScript 对大小写是敏感。...JavaScript 数据类型 类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、Symbol(独一无二)。...JavaScript 对象 键值对通常写法为 name : value 对象方法定义了一个函数,并作为对象属性存储。 对象方法通过添加 () 调用 (作为一个函数)。

31210

JavaScript学习(一)

输出内用””括起,直接输出””号内内容。 document.write("I love javascript!")... var mystr="hello"; document.write(mystr); 输出多项内容,内容之间用...3、alert输出内容可以是字符串或变量。 JavaScript-确认 confirm消息对话框通常用于允许永华做选择动作,如:”你确定吗?“等。弹出对话框(包括一个确定按钮一个取消按钮)。...如果省略这个参数,或者它是空字符串,那么窗口就不会显示任何文档。 2、窗口名称:可选参数,被打开窗口名称。 1.该名称有字母、数字下划线字符组成。 2.”...2、注意书写,innerHTML区分大小写。 改变HTML样式 HTML DOM允许JavaScript改变HTML元素样式。

3.3K30

【前端就业课 第一阶段】HTML5 零基础到实战(十)JavaScript基础一篇入门

会有一个返回进行返回,返回后将该存储到 histr 变量之中,最终使用代码进行输出显示 document.write(histr);。 小媛:原来是这么回事呀。...1_bit:在 JavaScript 中单引号双引号都可以表示字符串,在这里如果我使用了双引号,那么将会与其中 alert 弹窗所需要显示文本发生冲突,因为双引号这些都是成对存在,为了防止冲突...a 加 b ,否则将会直接输出 b ;最后直接使用 test() 调用函数,最后我们刷新一下这个页面,发现显示出了为 21,说明 a 在函数内部也可以去得到。...1_bit:对,这些还可以存储为不同类型数据,例如如下示例。...五、对象 1_bit:在 JavaScript 中对象是很关键一个概念,你还记得之前有说类对象这个知识点吗? 小媛:还记得。

97720

【奇淫巧技】Javascript入门笔记,打造最绚丽网页特效!

Javascript脚本语言同其他编程语言一样,拥有自身基本数据类型、表达式算术运算符及程序基本程序框架。Javascript提供了四种基本数据类型两种特殊数据类型用来处理数据和文字。...document.write('输出内容'); document.write(变量名); document.write(变量名+'输出内容'); //'+'是连接符,相当于php'.' 5...消息弹窗 alert(变量名); alert('输出内容'); confirm(变量名);confirm('输出内容'); //confirm是带有确定取消按钮弹窗,点击确定返回true,...//给变量定义内容 document.write("原标题:"+mychar.innerHTML+""); //打印原内容 mychar.innerHTML...= "New text"; //设置新内容 document.write("修改后标题:"+mychar.innerHTML); //打印新内容

1.3K60
领券