使用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实现长方形、直角三角形、平行四边形、等腰三角形、倒三角、数字三角形的更多相关文章
- Html 中select标签的边框与右侧倒三角的去除
首先是边框的去除:可以设置属性border:none;或border:0px; 不过这还是有一个bug,不同浏览器会在选中select标签时,加上一个边框: 之后是右侧倒三角的去除:设置属性 appe ...
- css倒三角的几种实现方式
在网页中,你在很多地方都能看到倒三角,比如tooltips,下拉菜单等.大家有几种方式来实现呢? 1.BASE64编码 图片 假如你已经有了三角形的图片,并且减少HTTP请求,那么将这个图片转换成一个 ...
- 利用overflow实现导航栏中常 出现的倒三角下拉小图标
常用网页界面中,导航栏中的倒三角下拉小图标实现,可用overflow: 效果如右图: .Triangle{position:relative;width:280px;height:15px;} ;ov ...
- css制作倒三角
布局div,并命名为id="dropdown",在style使用border属性对div进行控制 #dropdown{ width:0px; height:0px; border- ...
- div实现返回符,倒三角,椭圆+小知识收集
收集: 1,返回符(伪类元素): .back:before {content: "";width: .3rem;height: .3rem;border-left: .04rem ...
- FineReport——JS二次开发（隐藏下拉框控件的倒三角）
在对FR控件进行二次开发的过程中,需要自定义样式,比如下拉框控件带有自动检索的功能,但是又希望它的显示样式如同文本框一样,这时就需要隐藏多余的部分. 在对在线文档的查阅中可以发现很多选择器适用于多种控 ...
- java实现打印正三角，倒三角
正三角代码: package BasicType; /** * 封装一个可以根据用户传入值来打印正三角的方法 * @author Administrator */ public class Enme ...
- 用js写直角三角形，等腰三角形，菱形
//一. 画一个直角三角形 // 第几行 *号数 // * 1 1 // ** 2 2 // *** ...
- Python 打印矩形、直角三角形、等腰三角形、菱形
# 1)打印一个星号 print('*') #2)打印一行6个星号 * * * * * * for i in range(6): print('*',end=' ') #3)打印6列星号 * * * ...
随机推荐
- stout代码分析之三：Option类
为了安全表示NULL, stout实现了Option类.Option对象有两种状态: enum State { SOME, NONE, }; 其中SOME表示非空,NONE表示为空.可通过isSome ...
- 读取txt内容放入set中
package pingbi; /** * 将txt文本读入导入到set中 * 问题: * 第一个地方有会多一个 ?--解决问题很简单,但不知道问题的原因 */ import java.io.Buff ...
- JAVA--未明确定义列
原因:列明重复 可以加前缀或区别名以区分
- 字符串类dp的题目总结
熟练掌握回文串吧,大致有dp或者模拟类的吧 ①dp+预处理,懂得如何枚举回文串(一) ②dp匹配类型的题目(二) ③dp+预处理 子串类型 (三) ④字符串的组合数(四) 一:划分成回文串 UVA11 ...
- 2015/9/18 Python基础(14)：函数式编程
这篇写了忘发.现在补上. Python不是也不大可能成为一种函数式的编程语言,但是它支持许多有价值的函数式编程语言构建.也有些表现的像函数式编程机制但是从传统上也不能认为是函数式编程语言的构建.Pyt ...
- Windows/Linux javac/java编译运行引入所需的jar包
> Windows 假设要引用的jar放在D:/test目录下,名字为t1.jar, java源文件放在D:/test/src目录下,名字为t2.java. 编译: javac -cp d: ...
- 【bzoj3376-方块游戏】带权并查集
题意: n块积木,m个操作或询问.每次移动积木的时候,约翰会选择两块积木X,Y,把X搬到Y的上方.如果X已经和其它积木叠在一起了,那么应将这叠积木整体移动到Y的上方:如果Y已经和其它积木叠在一起了的, ...
- 【BZOJ2850】巧克力王国 [KD-tree]
巧克力王国 Time Limit: 60 Sec Memory Limit: 512 MB[Submit][Status][Discuss] Description 巧克力王国里的巧克力都是由牛奶和 ...
- Computer（HDU2196+树形dp+树的直径）
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2196 题目: 题意:有n台电脑,每台电脑连接其他电脑,第i行(包括第一行的n)连接u,长度为w,问你每 ...
- ie8下input文字偏上select文字偏下
1.ie8下input文字偏上 正常情况下input的显示情况如下 当设置input的高度时,就会出现文字不垂直居中偏上的情况,如图 解决方案 强input的行高line-height与其高度设置一致 ...