好程序员Web前端分享程序的三大结构(二)while循环

while(循环终止条件){
?????
}
案例

案例? 打印100以内 7的倍数:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>
var a=0;
while(a<=100){
a++;
if(a%7==0){
document.write(a+‘<br>‘);
}
}
</script>
</head>
<body>
</body>
</html>
案例? 打印100以内所有偶数的和
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>
var a=0;
var res=0;
while(a<=100){
a++;
if(a%2==0){
res+=a;
}
}
document.write(res)
</script>
</head>
<body>
</body>
</html>

打印图形
*
** 





<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>
var second=0;//一共打印多少行;>>>五行
while(second<=5){
second++
var length=0;
while(length<=10){//一行打印多少个>>>十个
length++;
document.write(‘*‘);
}
document.write(‘<br>‘)
}
</script>
</head>
<body>
</body>
</html>
for循环

? ? ? for循环将while循环分离的结构进行了整,将变量的声明自增,以及判断放入了括号中。写法更简单在开发中推荐使用。

for(var i = 0 ; i<10; i++){

? ? ?//语句块

}

for循环的执行顺序。(从上到下,从左到右?不!!)

1.先声明变量,2.然后判断,3.之后读取语句块,4.最后再对变量进行自增。

for(var i = 0?(1.声明变量)?; i < 10(2.进行判断)?; i ++(4.对变量进行自增)){
? ? ?//语句块(3.读取语句块)
}
案例:打印99乘法表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>
for(var i = 1 ; i < 10;i++){ //前面的数字 i;
for(var j = 1; j <= i; j++){//后面的数字 j
document.write(i+‘‘+j+‘=‘+ij+‘ ‘);//拼接第一个是公式,要用字符串拼接;第二个是计算结果用数字计算。最后加了一个空格 让页面更美观。
}
document.write(‘<br>‘)
}
</script>
</head>
<body>
</body>
</html>
案例:计算1+3+5+...+99的和:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<script>
var res=0;
for(var i = 1 ; i < 100;i++){
res+=i;
}
document.write(res);
</script>
</head>
<body>
</body>
</html>

案例:求123456....的结果;
<html lang="en">
<head>
<meta charset="utf-8">
<script>
var res = 1;
for (var i = 1; i <= 20; i++) {
res
= i;
}
document.write(res)
</script>
</head>
<body>
</body>
</html>

原文地址:https://blog.51cto.com/14249543/2398590

时间: 2024-10-18 05:59:30

好程序员Web前端分享程序的三大结构(二)while循环的相关文章

好程序员web前端分享CSS文件引用的最优方法

好程序员web前端分享CSS文件引用的最优方法,在html总引入css文件的方法: 1链接式: 2导入式: 区别: 使用链接式时,会在加载页面主体部分之前加载css文件,这样现实出来的页面一开始就是带有样式效果的,而使用导入式时,会在整个页面装载完成之后再装载css文件,对于有的浏览器来说,在一些情况下,如果页面文件的体积比较大,则会出现先现实无样式的页面,闪烁一下之后再出现设置样式的效果.从浏览者的感受来说,这是使用导入式的一个缺陷.** 链接式比导入式快. 当有多个文件链接到页面的时候会导致

好程序员web前端分享css常用属性缩写

好程序员web前端分享css常用属性缩写,使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #000000可以缩写为#000;#336699可以缩写为#369; 盒尺寸 通常有下面四种书写方法: property:value1; 表示所有边都是一个值value1; property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2 pr

好程序员web前端分享HTML基础篇

好程序员web前端分享HTML基础篇,最近遇到很多新手,都会问,如果要学web前端开发,需要学什么?难不难学啊?多久能入门之类的问题?那么今天好程序员就先来给大家分享一下web前端学习路线:HTML基础 学习目标 1.本专业介绍.HTML相关概念,HTML发展历史 2.WEB标准,W3C/WHATWG/ECMA相关概念 3.相关软件的应用以及站点的创建 4.HTML基本结构和HTML语法 5.HTML常用标记 一.本专业介绍.HTML相关概念,HTML发展历史 本专业介绍 移动前端/WEB前端

好程序员web前端分享定位锚点透明

好程序员web前端分享定位锚点透明 学习目标 1.position 定位属性和属性值 2.定位元素的层级属性 3.包含块的概念和应用 4.锚点连接的语法和应用场景 5.透明属性的应用 6.扩展:Flash和marquee(滚动字幕) 一.position 定位属性和属性值 position 定位属性,检索对象的定位方式:语法:position:static /absolute/relative/fixed/inherit/sticky/unset(未设置是inherit和initial的结合)/

好程序员web前端分享MVVM框架Vue实现原理

好程序员web前端分享MVVM框架Vue实现原理,Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js和react.js更加简洁.更易于理解的API,使得我们能够快速地上手并使用Vue.js. ? 1.什么是MVVM呢? MVVM的简写是Model-View-ViewModel. 在过去的10年里面,我们已经把很多传统的服务端代码放到了浏览器中,这样就产生了成千上万行的javascript代码,它们连接了HTML 和CSS文

好程序员web前端分享如何构建单页Web应用

好程序员web前端分享如何构建单页Web应用,首先我们来看一看单页应用是什么?所谓单页应用,指的是在一个页面上集成多种功能,甚至整个系统就只有一个页面,所有的业务功能都是它的子模块,通过特定的方式挂接到主界面上.它是AJAX技术的进一步升华,把AJAX的无刷新机制发挥到极致,因此能造就与桌面程序媲美的流畅用户体验. 其实单页应用我们并不陌生,很多人写过ExtJS的项目,用它实现的系统,很天然的就已经是单页的了,也有人用jQuery或者其他框架实现过类似的东西.用各种JS框架,甚至不用框架,都是可

好程序员web前端分享Cookie知识

好程序员web前端分享Cookie知识,今天小编为大家带来了一篇新手必看干货,接下来让我们一起来看一看吧. 一.Cookie的出现 浏览器和服务器之间的通信少不了HTTP协议,但是因为HTTP协议是无状态的,所以服务器并不知道上一次浏览器做了什么样的操作,这样严重阻碍了交互式Web 应用程序的实现. 针对上述的问题,网景公司的程序员创造了Cookie. 二.Cookie的传输 服务器端在实现Cookie标准的过程中,需要对任意HTTP请求发送Set-Cookie HTTP头作为响应的一部分: 1

好程序员web前端分享html中meta标签及用法详解

好程序员web前端分享html中meta标签及用法详解,这篇文章给大家介绍了html中meta标签及用法详解,感兴趣的朋友一起看看,Html中meta标签一.meta标签 含义 <meta> 元素 可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词. <meta> 标签位于文档的头部,不包含任何内容. <meta> 标签的属性定义了与文档相关联的名称/值对.二.meta 中常用属性 charset? (字符集) 说明:规

好程序员web前端分享HTML5常见面试题集锦四

好程序员web前端分享HTML5常见面试题集锦四1.为什么要初始化CSS样式?答案:因为浏览器的兼容问题,不同浏览器对有些标签的默认值是不同的,如果没对CSS初始化往往会出现浏览器之间的页面显示差异.当然,初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化.2.浮动元素引起的问题?答案:a. 父元素的高度无法被撑开,影响与父元素同级的元素b. 与浮动元素同级的非浮动元素会跟随其后c. 若非第一个元素浮动,则该元素之前的元素也需要浮动,否则会影响页面显示的结构3.l