javascript中for循环和标签元素赋值问题总结
<!DOCTYPE html>
<html>
<body>
<p>点击下面的按钮，将代码块循环五次：</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
var x="";
for (var i=0;i<5;i++)
{
x=x + "The number is " + i + "<br>";
document.getElementById("demo").innerHTML=x;
}
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<body>
<p>点击下面的按钮，将代码块循环五次：</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction()
{
var x="";
for (var i=0;i<5;i++)
{
x=x + "The number is " + i + "<br>";
}
document.getElementById("demo").innerHTML=x;
}
</script>
</body>
</html>
上面两段代码是来自w3school中的一个关于for循环和标签元素赋值的问题的例子，我是之前一直纠结于将document.getElementById("demo").innerHTML=x;放在for循环内外结果为什么一样?
放在外边的情况很好理解，无非是p标签输出了循环到最后的x的结果，即：
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
而放在里面的情况，我之前一直认为是每循环一次p标签输出一次x的结果，即：
The number is 0
The number is 0
The number is 1
The number is 0
The number is 1
The number is 2
The number is 0
The number is 1
The number is 2
The number is 3
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
但这样的想法是错误的，因为p标签是闪现了5次输出的结果，最后显示的是最终输出的x结果，而不是把每次的值都显示出来，即：
The number is 0
The number is 1
The number is 2
The number is 3
The number is 4
---------------------
javascript中for循环和标签元素赋值问题总结的更多相关文章
- JavaScript中For循环以及For循环嵌套实例
JavaScript中For循环实例 1.打印出所有的 "水仙花数 ",所谓 "水仙花数 "是指一个三位数,其各位数字立方和等于该数本身. 例如:153是一个 ...
- JavaScript 中 for 循环
在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循 ...
- Javascript中的循环变量声明，到底应该放在哪儿？
相信很多Javascript开发者都在声明循环变量时犹豫过var i到底应该放在哪里:放在不同的位置会对程序的运行产生怎样的影响?哪一种方式符合Javascript的语言规范?哪一种方式和ecma标准 ...
- JavaScript基础Javascript中的循环(003)
1.普通循环JavaScript中一般的循环写法是这样的: // sub-optimal loop for (var i = 0; i < myarray.length; i++) { // d ...
- 【跟着子迟品 underscore】JavaScript 中如何判断两个元素是否 "相同"
Why underscore 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. 阅读一些著名框架类库的源码,就好像和一个个大师对 ...
- 我在学JavaScript中的循环
for (var num1 = 1;num1 < 10;num1++ ){ for (var num2 = 1;num2< 10;num2++ ){ console.log(num1+'* ...
- [译]Javascript中的循环
本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...
- JavaScript中的window对象的属性和方法；JavaScript中如何选取文档元素
一.window对象的属性和方法 ①setTimeout()方法用来实现一个函数在指定毫秒之后运行,该方法返回一个值,这个值可以传递给clearTimeout()用于取消这个函数的执行. ②setIn ...
- JavaScript中的循环和闭包
看一段比较经典的错误代码: // 希望获取页面上的所有div,在点击的时输出对应的编号 var oDom = document.querySelectorAll("div"); / ...
随机推荐
- 洛谷 P2347 砝码称重 & [NOIP1996提高组]（dp，枚举）
传送门 解题思路 一看数据范围<1000就坚定了我暴力的决心(不愧是1996年代的题还是t4QAQ) 所以很显然,暴力之中有一点dp的思想,就是把它们像多重背包一样拆分,拆成a1+a2+a3+a ...
- HDU 1231 题解
题面: 最大连续子序列 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Problem ...
- cmd常用快捷键
Crtl + Shift +Enter : 以管理员的方式进入命令行模式 ESC: 清楚当前行的内容 Alt + Enter : 全屏/退出全屏 F7 : 通过列表形式查看历史记录 F4 : 快速删除 ...
- PyTorch环境配置及安装
环境配置 温馨提示:为了更好的教程体验,提供视频.阅读地址 Youtube: https://www.youtube.com/playlist?list=PLgAyVnrNJ96CqYdjZ8v9Yj ...
- localStorage的使用和vuex的拆分
问题1:在隐身模式.或者用户未启用的情况下,使用localStorage可能会导致浏览器直接报错,怎么办? 方法:使用try-catch包裹 代码示例: store.jsimport Vue from ...
- Python 项目转化为so文件
思路是先将py转换为c代码,然后编译c为so文件,所以要安装以下内容: python 安装:cython pip install cython linux 安装:python-devel,gcc yu ...
- Apache 的 httpd.conf 配置文件
http.conf 是 Apache 的配置文件,Apache 的常见配置主要是通过修该文件实现的,修改之后需要 重启 Apache 服务生效. Httpd.conf #Apache 安装目录 Ser ...
- 图解Qt安装（Windows平台）
http://c.biancheng.net/view/3858.html 本节介绍 Qt 5.9.0 在 Windows 平台下的安装,请提前下载好 Qt 5.9.0.不知道如何下载 Qt 的读者请 ...
- IPv6地址格式示例及IPv6与IPv4的区别分析
认识IPv6地址 IPv4地址是类似 A.B.C.D 的格式,它是32位,用\".\"分成四段,用10进制表示: 而IPv6地址类似X:X:X:X:X:X:X:X的格式,它是128 ...
- Codeforces 940 区间DP单调队列优化
A #include <bits/stdc++.h> #define PI acos(-1.0) #define mem(a,b) memset((a),b,sizeof(a)) #def ...