js菱形代码(菱形的代码)
admin 发布:2022-12-19 19:34 158
本篇文章给大家谈谈js菱形代码,以及菱形的代码对应的知识点,希望对各位有所帮助,不要忘了收藏本站喔。
本文目录一览:
JavaScript用for循环打印这个菱形。
function Printfile() {
var num = prompt("请输入菱形的边长(单击确定之后会看到以*为单位长度组成的菱形)");
for (var i = 1; i = num; i++) //决定输出的行数
{
for (var j = 1; j = num - i; j++) //决定每一行开头的空格数
{
document.write("nbsp");
}
for (var k = 1; k = 2 * i - 1; k++) //决定每一行的*数
{
document.write("*");
}
document.write("/br");
}
for (var i = 1; i = num - 1; i++) //决定输出的行数
{
for (var j = 1; j = i; j++) //决定每一行开头的空格数
{
document.write("nbsp");
}
for (var k = 1; k = 2 * num - 1 - 2 * i; k++) //决定每一行的*数
{
document.write("*");
}
document.write("/br");
}
}
调用后让你输入边长,输入之后就会出现菱形。
调用代码:
Printfile();
怎么用js输出一个菱形
方法有很多,我用HTML5的canvas写一个,你直接copy然后创建一个HTML文件,用google浏览器或者火狐亦或是高版本的IE打开就可以看到了
!DOCTYPE html
html
head
meta charset="UTF-8"
title/title
style type="text/css"
body{
margin: 0;
padding: 0;
}
#myCanvas{
margin:200px 600px;
border:5px solid #9c9898
}
/style
script type="text/javascript"
window.onload = function(){
var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
drawLine(context,250,10,490,250,20,"blue","round");
drawLine(context,490,250,250,490,20,"blue","round");
drawLine(context,250,490,10,250,20,"blue","round");
drawLine(context,10,250,250,10,20,"blue","round");
}
function drawLine(context,startX,startY,endX,endY,lineWidth,strokeStyle,lineCap){
context.beginPath();
context.moveTo(startX,startY);
context.lineTo(endX,endY);
context.lineWidth = lineWidth;
context.strokeStyle = strokeStyle;
context.lineCap = lineCap;
context.stroke();
}
/script
/head
body
canvas id="myCanvas" width="500" height="500"/canvas
/body
/html
用Javascript语言做菱形
代码如下,你要的菱形
HTML
HEAD
TITLE New Document /TITLE
script
function draw(){
var line = parseInt(document.getElementById("myvalue").value);
var lineTemp = line%2;
if(0==lineTemp){
alert("函数必须是奇数");
return;
}
lineTemp = parseInt(line/2);
alert("line="+line+" lineTemp="+lineTemp);
var strArr = new Array();
for(var i=0;ilineTemp;i++){
for(var j=0;jline;j++){
if(((j+i)==lineTemp)||((j-i)==lineTemp)){
strArr.push("*");
}else{
strArr.push(" ");
}
}
strArr.push("br");
}
for(var i=lineTemp;iline;i++){
for(var j=0;jline;j++){
if(((j+i)==3*lineTemp)||((i-j)==lineTemp)){
strArr.push("*");
}else{
strArr.push(" ");
}
}
strArr.push("br");
}
document.getElementById("mydiv").innerHTML = strArr.join('');
}
/script
/HEAD
BODY
请输入奇数:input type="text" value="3" id="myvalue"
input type="button" onclick="draw()" value="show"
div id="mydiv"/div
/BODY
/HTML
js菱形代码的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于菱形的代码、js菱形代码的信息别忘了在本站进行查找喔。
版权说明:如非注明,本站文章均为 AH站长 原创,转载请注明出处和附带本文链接;
相关推荐
- 04-28clearfix代码(clearX)[20240428更新]
- 04-28安卓小游戏代码项目下载(java简单手机小游戏源代码)[20240428更新]
- 04-28免费的手机端设计代码(手机端编写代码)[20240428更新]
- 04-28asp测试代码怎么写(ASP测试)[20240428更新]
- 04-28北京时间网页代码(中国北京时间代码)[20240428更新]
- 04-28网页页尾代码(网页制作尾部)[20240428更新]
- 04-28网站背景音乐自动播放代码(html背景音乐自动播放代码)[20240428更新]
- 04-28推箱子html代码(推箱子小游戏的代码)[20240428更新]
- 04-28手机版在线留言asp代码(asp手机网站源码)[20240428更新]
- 04-28淘宝js轮播代码(淘宝轮播图代码)[20240428更新]
取消回复欢迎 你 发表评论:
- 标签列表
- 最近发表
- 友情链接