通过原生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 内容区域保持宽度 ...
随机推荐
- Xcode 5 SVN配置
from:http://stackoverflow.com/questions/19180718/import-a-project-in-svn-from-xcode-5/19410994#19410 ...
- laravel装饰者模式例子
interface Decorator{ public function display(); } class XiaoFang implements Decorator { private $nam ...
- iframe 的那些事儿
项目中有不少地方用到iframe,今儿把使用iframe遇到的一些问题一块儿总结一下. 1.javascript监听iframe加载完成事件 iframe加载过程需要一定时间,这个加载过程常常出现白屏 ...
- Web-动态页面
<!doctype html>01 - JavaEE- JSP - EL&JSTL figure:first-child { margin-top: -20px; } #write ...
- (转)Nginx+Php-fpm运行原理详解
一.代理与反向代理 现实生活中的例子 1.正向代理:访问google.com 如上图,因为google被墙,我们需要vpn翻墙才能访问google.com. vpn对于“我们”来说,是可以感知到的(我 ...
- 洛谷P2371 [国家集训队]墨墨的等式
P2371 [国家集训队]墨墨的等式 题目描述 墨墨突然对等式很感兴趣,他正在研究a1x1+a2y2+-+anxn=Ba_1x_1+a_2y_2+-+a_nx_n=Ba1x1+a2y2+-+a ...
- P4860 Roy&October之取石子II
4的倍数不行,之间的数都可以到4的倍数,而6的倍数不能到4的倍数 #include <iostream> #include <cstdio> #include <queu ...
- day1-字符串、列表
字符串操作: name = "Wills Qian" # 创建字符串变量 print(len(name)) # 打印字符串长度 print(name[0]) # 提取第一个字符W ...
- Java参数校验工具validation实践
介绍 在项目开发当中,数据校验是你必须要考虑和面对的事情,为此要写上一大串的代码进行校验,这样就会导致代码冗余和一些管理的问题. 例如下面的代码: public void push(List<L ...
- Angular CLI ng常用指令整理
一.组件创建 ng generate component heroes 二.运行项目 ng serve --open //--open 立即打开 三.创建指令 ng g directive my-ne ...