通过原生JS打印一个空心菱形图案
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head> <body>
</body>
</html>
<script>
// 打印一个空心菱形图案
for(var i = 1; i <=6 ; i++){
for(var k = 1 ; k<=6-i; k++){
document.write("-");
}
for(var j = 1 ; j<=i*2-1; j++){
if(i == 1){
document.write("*");
}else if(j == 1 || j == i*2-1){
document.write("*");
}else{
document.write("-");
}
}
document.write("<br>");
}
for(var i = 5; i >=1 ; i--){
for(var k = 1 ; k<=6-i; k++){
document.write("-");
}
for(var j = 1 ; j<=i*2-1; j++){
if(i == 1){
document.write("*");
}else if(j == 1 || j == i*2-1){
document.write("*");
}else{
document.write("-");
}
}
document.write("<br>");
}
</script>
通过原生JS打印一个空心菱形图案的更多相关文章
- Java基础知识强化07：打印出空心菱形
1.如图打印出空心菱形: 2.下面是逻辑实现代码: package himi.hebao04; import java.util.Scanner; public class TestDemo08 { ...
- 原生js实现一个DIV的碰撞反弹运动，并且添加重力效果
继上一篇... 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果 关键在于边界检测,以及乘以的系数问题,实现代码并不难,如下: <!DOCTYPE html> <html la ...
- 原生js实现一个DIV的碰撞反弹运动
原生js实现一个DIV的碰撞反弹运动: 关键在于DIV的边界检测,进而改变运动方向,即可实现碰撞反弹效果. <!DOCTYPE html> <html lang="en& ...
- 用原生js写一个"多动症"的简历
用原生js写一个"多动症"的简历 预览地址源码地址 最近在知乎上看到@方应杭用vue写了一个会动的简历,觉得挺好玩的,研究一下其实现思路,决定试试用原生js来实现. 会动的简历实现 ...
- 使用原生JS实现一个风箱式的demo，并封装了一个运动框架
声明,该DEMO依托于某个培训机构中,非常感谢这个培训结构.话不多说,现在开始改demo的制作. 首先,在前端的学习过程中,轮播图是我们一定要学习的,所以为了更加高效的实现各种轮播图,封装了一个运动的 ...
- 原生js实现一个简单的轮播图
想锻炼一下自己的原生js能力可以从写一个轮播图开始,轮播图的运用想必大家都知道吧,好了废话不多说,开始记笔记了,一些需要注意的点,我都在代码中标注了 首先是构造html: <div id=&qu ...
- 用原生JS实现一个轮播（包含全部代码和详细思路）
在我看来要想实现轮播主要是要知道当前位于的页面和即将位于的页面.这个案例是通过改变图片的透明度来实现轮播的效果. 我把涉及的知识点分为两个方面,分别是HTML+css和JS. 第一部分(html+cs ...
- 用原生JS写一个网页版的2048小游戏（兼容移动端）
这个游戏JS部分全都是用原生JS代码写的,加有少量的CSS3动画,并简单的兼容了一下移动端. 先看一下在线的demo:https://yuan-yiming.github.io/2048-online ...
- 原生js实现一个侧滑删除取消组件（item slide）
组件,本质上是解决某个问题封装的类,在此记录原生js实现侧滑删除 先上效果图 实现思路 1. 确定渲染的数据结构 2. 思考划分布局,总的有两个主要的模块:内容区域和按钮区域 2.1 内容区域保持宽度 ...
随机推荐
- iis网站域名绑定
这里解释两种绑定 一.全局ip未分配 二.绑定指定域名 1.添加主机名 注释:没有绑定主机名的进站默认就会被访问.绑定主机名的进站访问特定主机名的网站.
- Spring MVC(十五)--SpringMVC国际化配置项
Spring MVC中,当DispatcherServlet初始化的时候,会解析一个LocaleResolver接口的实现类,这个实现类就是用来解析国际化的. 一.国际化解析器 Spring MVC中 ...
- Java学习之程序运行机制
Java的运行机制是:先编译,后解释. 典型的编译型编程语言是:C和C++. eg:用c语言编写的*.c文件编译生成*.h文件,通过链接将*.h文件链接成*.exe文件,然后就可以运行,编译型的高级语 ...
- python爬取（自动化）豆瓣电影影评，并存储。
from selenium import webdriverfrom selenium.webdriver import ActionChainsimport time driver = webdri ...
- 0讲Java，给你一条简单清晰的学习道路！
1. 计算机基础: 1.1 数据结构基础: 主要学习:1.向量,链表,栈,队列和堆,词典.熟悉2.树,二叉搜索树.熟悉3.图,有向图,无向图,基本概念4.二叉搜索A,B,C类熟练,9大排序熟悉.5.树 ...
- 查看linux的shhd端口号 netstat | grep sshd
[root@iZ2zef51hufoaycipfxek8Z ~]# [root@iZ2zef51hufoaycipfxek8Z ~]# netstat | grep sshd [root@iZ2zef ...
- h5 上下左右前后居中
.outer { width: 200px; height: 200px; background: red; position: relative; } .inner { position: abso ...
- tensorflow识别验证码（2）-tensorflow 编写CNN 识别验证码
1. 导入依赖包 #coding:utf-8 from gen_captcha import gen_captcha_text_and_image from gen_captcha import nu ...
- PostgreSQL问题解决--连接数过多
I am trying to connect to a Postgresql database, I am getting the following Error: Error:org.postgre ...
- canvas石英钟
canvas石英钟:demo <!DOCTYPE html> <html> <head lang="en"> <meta charset= ...