使用JavaScript循环嵌套解决各种图形
【循环嵌套的规律】
1、外层循环控制行数，内层循环控制每行中元素的个数。
【图形题思路】
1、确定图形有几行，行数即为外层循环次数；
2、确定每行中有几种元素组成，有几种元素表示有几个内层循环；
3、确定每种元素的个数，这个个数即为每个内层元素循环次数。
如果每种元素的个数不固定，则找出每种元素的个数，与行号的关系，
这个关系表达式即为内循环的最大值。
1、长方形
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*
*****
*****
*****
*****
*****
*/
for(var i=1;i<=5;i++){
document.write("<br/>");
for(j=1;j<=5;j++){
document.write("*");
}
}
</script>
</body>
</html>
2、直角三角形
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*
*
**
***
****
*****
*/
for(i=1;i<=5;i++){
document.write(" "+"<br/>");
for(j=1;j<=i;j++){
document.write("*");
}
}
</script>
</body>
</html>
3、平行四边形
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*
*****
*****
*****
*****
*****
*/
for(var i=1;i<=5;i++){
document.write("<br/>");
for(var j=1;j<=i-1;j++) {
document.write(" ");
}
for (var k = 1; k <= 5; k++) {
document.write("*");
}
}
</script>
</body>
</html>
4、等腰三角形
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*
*
***
*****
*******
*********
*/
for(var i=1;i<=5;i++){
document.write("<br/>");
for(var j=1;j<=5-i;j++) {
document.write(" ");
}
for (var k = 1; k <=2*i-1; k++) {
document.write("*");
}
}
</script>
</body>
</html>
5、倒三角
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*
*********
*******
*****
***
*
*/
for(var i=0;i<=5;i++){
document.write("<br/>");
for(var j=0;j<=i;j++) {
document.write(" ");
}
for (var k = 1; k <=2*(5-i)-1; k++) {
document.write("*");
}
}
</script>
</body>
</html>
6、数字三角形
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script type="text/javascript">
/*
1
121
12321
1234321
123454321
*/
for(var i=1;i<=5;i++){
for(var j=1;j<=5-i;j++) {
document.write(" ");
}
var num = 1;
// 递增的数
for(var k=1; k<=i; k++){
document.write(num);
num++;
}
// 递减的数
num -= 2;
for(var l=1; l<=i-1; l++){
document.write(num);
num--;
}
// 回车
document.write("<br>");
}
</script>
</body>
</html>
使用JavaScript循环嵌套解决各种图形的更多相关文章
- JS循环+循环嵌套+经典例题+图形题
首先,了解一下循环嵌套的特点:外层循环转一次,内层循环转一圈. 在上一篇随笔中详细介绍了JS中的分支结构和循环结构,我们来简单的回顾一下For循环结构: 1.for循环有三个表达式,分别为: ①定义循 ...
- [Python]循环嵌套nested loop-练习题
[python的for循环嵌套打印如下图形] 图形一: ******* ******* ******* ******* 图形二: * *** ***** ******* 图形三: * *** **** ...
- JS中for循环嵌套
for 循环 for语句也是一种前测试循环语句,但它具有在 执行循环之前初始化变量 和 定义循环后要执行的代码的能力 for循环中专门提供了位置来放置循环的三个表达式 定义一个循环需要做实现这三步: ...
- 【JS中循环嵌套常见的六大经典例题+六大图形题，你知道哪几个？】
首先,了解一下循环嵌套的特点:外层循环转一次,内层循环转一圈. 在上一篇随笔中详细介绍了JS中的分支结构和循环结构,我们来简单的回顾一下For循环结构: 1.for循环有三个表达式,分别为: ①定义循 ...
- JavaScript中For循环以及For循环嵌套实例
JavaScript中For循环实例 1.打印出所有的 "水仙花数 ",所谓 "水仙花数 "是指一个三位数,其各位数字立方和等于该数本身. 例如:153是一个 ...
- 使用 JavaScript 用循环嵌套输出乘法表。外循环控制行数，内循环控制当前行要输出的乘法表达式，在页面上输出九九乘法表
查看本章节 查看作业目录 需求说明: 在页面上输出九九乘法表,实现效果如图所示 实现思路: 创建HTML页面 在页面中嵌入 <script type="text/javascript& ...
- Java基础_循环嵌套_打印乘法口诀、菱形，各种图形，计算二元一次和三元一次方程组_7
循环嵌套 打印乘法口诀 for(int j=1;j<=9;j++){ for(int i=1;i<=j;i++){ System.out.print(i+"*"+j+& ...
- C#用链式方法表达循环嵌套
情节故事得有情节,不喜欢情节的朋友可看第1版代码,然后直接跳至“三.想要链式写法” 一.起缘 故事缘于一位朋友的一道题: 朋友四人玩LOL游戏.第一局,分别选择位置:中单,上单,ADC,辅助:第二局新 ...
- SQL连接操作符介绍（循环嵌套, 哈希匹配和合并连接）
今天我将介绍在SQLServer 中的三种连接操作符类型,分别是:循环嵌套.哈希匹配和合并连接.主要对这三种连接的不同.复杂度用范例的形式一一介绍. 本文中使用了示例数据库AdventureWorks ...
随机推荐
- RabbitMQ入门-Routing直连模式
Hello World模式,告诉我们如何一对一发送和接收消息: Work模式,告诉我们如何多管齐下高效的消费消息: Publish/Subscribe模式,告诉我们如何广播消息 那么有没有灵活强一点的 ...
- echarts 柱状图，每根柱子显示不同颜色（随机显示和定制显示）
1,定制显示 option = { title: { text: '某地区降水量', subtext: '纯属虚构' }, tooltip: { trigger: 'axis' }, grid: { ...
- 实例甜点 Unreal Engine 4迷你教程(6)之三个重要基础操作SpawnActor、TArray的Add和Remove
本小节的教程需要完成前置教程:建议阅读<实例甜点 Unreal Engine 4迷你教程(5)>,因为5里面提到了本节的工程,不过也可以在不看5的前提下直接阅读本教程. 第一步:Empty ...
- table表格中单击添加动态编辑框
var $newNode=$("<input type='text' style='width:250px; height:20px; maxlength='20' id='texti ...
- Oracle中dblink如何使用
Oracle中dblink应用小结Oracle应用服务器OS 1.查看数据库的global_name SELECT * FROM GLOBAL_NAME; 2.查看global ...
- python中的赋值和深浅拷贝
python中,A object = B object 是一种赋值操作,赋的值不是一个对象在内存中的空间,而只是这个对象在内存中的位置 . 此时当B对象里面的内容发生更改的时候,A对象也自然而然的 ...
- DB2 HADR备库归档问题
--DB2 HADR备库归档问题 --------------------------------2013/10/29 我们注意到在Oracle DataGuard中,备机中依然会设置LOG_ARCH ...
- python之----------字符编码具体原理
1.内存和硬盘都是用来存储的. CPU:速度快 硬盘:永久保存 2.文本编辑器存取文件的原理(nodepad++,pycharm,word) 打开编辑器就可以启动一个进程,是在内存中的,所以在编辑器编 ...
- Spark Streaming 调优指南
SparkStreaming是架构在SparkCore上的一个"应用",SparkStreaming主要由DStreamGraph.Job的生成.数据的接收和导入以及容错四大模块组 ...
- Android自定义控件系列之基础篇
一.概述 在android开发中很多UI控件往往需要进行定制以满足应用的需要或达到更加的效果,接下来就通过一个系列来介绍自定义控件,这里更多是通过一些案例逐步去学习,本系列有一些典型的应用,掌握好了大 ...