<!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打印一个空心菱形图案的更多相关文章

  1. Java基础知识强化07：打印出空心菱形

    1.如图打印出空心菱形: 2.下面是逻辑实现代码: package himi.hebao04; import java.util.Scanner; public class TestDemo08 { ...

  2. 原生js实现一个DIV的碰撞反弹运动，并且添加重力效果

    继上一篇... 原生js实现一个DIV的碰撞反弹运动,并且添加重力效果 关键在于边界检测,以及乘以的系数问题,实现代码并不难,如下: <!DOCTYPE html> <html la ...

  3. 原生js实现一个DIV的碰撞反弹运动

     原生js实现一个DIV的碰撞反弹运动: 关键在于DIV的边界检测,进而改变运动方向,即可实现碰撞反弹效果. <!DOCTYPE html> <html lang="en& ...

  4. 用原生js写一个"多动症"的简历

    用原生js写一个"多动症"的简历 预览地址源码地址 最近在知乎上看到@方应杭用vue写了一个会动的简历,觉得挺好玩的,研究一下其实现思路,决定试试用原生js来实现. 会动的简历实现 ...

  5. 使用原生JS实现一个风箱式的demo，并封装了一个运动框架

    声明,该DEMO依托于某个培训机构中,非常感谢这个培训结构.话不多说,现在开始改demo的制作. 首先,在前端的学习过程中,轮播图是我们一定要学习的,所以为了更加高效的实现各种轮播图,封装了一个运动的 ...

  6. 原生js实现一个简单的轮播图

    想锻炼一下自己的原生js能力可以从写一个轮播图开始,轮播图的运用想必大家都知道吧,好了废话不多说,开始记笔记了,一些需要注意的点,我都在代码中标注了 首先是构造html: <div id=&qu ...

  7. 用原生JS实现一个轮播（包含全部代码和详细思路）

    在我看来要想实现轮播主要是要知道当前位于的页面和即将位于的页面.这个案例是通过改变图片的透明度来实现轮播的效果. 我把涉及的知识点分为两个方面,分别是HTML+css和JS. 第一部分(html+cs ...

  8. 用原生JS写一个网页版的2048小游戏（兼容移动端）

    这个游戏JS部分全都是用原生JS代码写的,加有少量的CSS3动画,并简单的兼容了一下移动端. 先看一下在线的demo:https://yuan-yiming.github.io/2048-online ...

  9. 原生js实现一个侧滑删除取消组件（item slide）

    组件,本质上是解决某个问题封装的类,在此记录原生js实现侧滑删除 先上效果图 实现思路 1. 确定渲染的数据结构 2. 思考划分布局,总的有两个主要的模块:内容区域和按钮区域 2.1 内容区域保持宽度 ...

随机推荐

  1. 使用Windbg调试系统弹出的内存不可读错误

    步骤: 1. 使用Windbg挂钩到崩溃的进程上面 2. 使用~*k列出所有线程 3. 搜索UnhandledExceptionFilter所在的线程 4. 使用~ns切换到上面崩溃所在的线程,n为线 ...

  2. idea运行tomcat，控制台中文乱码

    加入参数:-Dfile.encoding=UTF-8

  3. Spring中AOP的实现

    Spring中整合了AOP的功能,虽然有不足,没有专门做AOP框架的那么完美,但是用一用感觉还是不错的 一些概念: AOP 面向切面编程 aspect 切面/切面类(我个人认为一个真正被解耦的程序,切 ...

  4. springboot新手脱坑之无法下载依赖包

    1. Apache maven 3.39配置 1.环境变量自己配置, 2.配置阿里云镜像和本地仓库 <localRepository>D:\Apache\maven\repository& ...

  5. 01_MyBatis入门

    一.MyBaits介绍 1.MyBatis 本是apache的一个开源项目iBatis, 2010年这个项目由apache software foundation 迁移到了google code,并且 ...

  6. 0讲Java，给你一条简单清晰的学习道路！

    1. 计算机基础: 1.1 数据结构基础: 主要学习:1.向量,链表,栈,队列和堆,词典.熟悉2.树,二叉搜索树.熟悉3.图,有向图,无向图,基本概念4.二叉搜索A,B,C类熟练,9大排序熟悉.5.树 ...

  7. 2019-11-12-浅谈-Windows-桌面端触摸架构演进

    title author date CreateTime categories 浅谈 Windows 桌面端触摸架构演进 lindexi 2019-11-12 14:37:31 +0800 2019- ...

  8. LINUX用户和用户组操作命令

    Id Finger Pwck 检查/etc/passwd配置文件内的信息与实际主文件夹是否存在,还可比较/etc/passwd和/etc/shadow的信息是否一致,另外如果/etc/passwd中的 ...

  9. nodejs实现读取文件

    今天后端同事下班,想让我读取一个文件的内容.我想这个是小忙啊,就立马答应了. 我知道这个是nodejs读取,可是我又想,平时我们都要起一个服务才能够运行node服务器, 比如如下代码 var http ...

  10. Python-线程(2)

    目录 GIL全局解释器锁 GIL 与 Lock 多进程 VS 多线程 死锁现象 递归锁 信号量 Semaphore 线程队列 GIL全局解释器锁 在Cpython解释器中,同一个进程下开启的多线程,同 ...