window.onload和3的小游戏
window.onload出现的原因?
我们都知道页面的代码顺序是从上往下进行加载,很多时候我们要对页面中的某一个模块进行操作,这时候我们常常使用javascript代码来进行操作。为了能够保证操作的模块或对象在js代码之前就加载了,我们不得不把js代码放在页面的底端。但是我们在设计页面的时候,为了把js代码放在一起,或者一个让页面更加简洁的位置,那就有可能出现代码中操作的对象未被加载的情况,那么我们该如何去解决呢?这时候window.onload就被有了存在的意义了。
window.onload是什么?
window.onload是一个事件,在文档加载完成后能立即触发,并且能够为该事件注册事件处理函数。将要对对象或者模块进行操作的代码存放在处理函数中。即:window.onload =function (){这里写操作的代码};
发生要对对象进行,而对象还未被加载,导致相当于无操作的实例:
编码
3的小游戏,练习使用循环和条件语句,实现如下需求:
- 从1到100,以此在console输出各数字,但是,当数字为3的倍数或者含有3的时候,输出“PA”
- 比如:1,2,PA,4,5,PA,……,11,PA,PA,14,PA……
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>3的小游戏</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head> <body> <script>
window.onload = function game() {
var c = 100;
for (i = 1; i <= c; i++) {
if (i % 3 == 0 || String(i).indexOf("3") >= 0) {
console.log("PA");
continue;
} else {
console.log(i);
}
}
}
</script>
</body> </html>
window.onload和3的小游戏的更多相关文章
- $(document).ready和window.onload,细微小区别,ready是jQuery的方法,onload是window的方法
$(document).ready和window.onload的区别 $(document).ready和window.onload都是在都是在页面加载完执行的函数,大多数情况下差别不大,但也是有区别 ...
- java 图形化小工具Abstract Window Toolit :画笔Graphics,画布Canvas(),弹球小游戏
画笔Graphics Java中提供了Graphics类,他是一个抽象的画笔,可以在Canvas组件(画布)上绘制丰富多彩的几何图和位图. Graphics常用的画图方法如下: drawLine(): ...
- 如何开发一个简单的HTML5 Canvas 小游戏
原文:How to make a simple HTML5 Canvas game 想要快速上手HTML5 Canvas小游戏开发?下面通过一个例子来进行手把手教学.(如果你怀疑我的资历, A Wiz ...
- JS写小游戏(一):游戏框架
前言 前一阵发现一个不错的网站,都是一些用html5+css+js写的小游戏,于是打算学习一番,写下这个系列博客主要是为了加深理解,当然也有一些个人感悟,如果英文好可以直接Click Here. 概述 ...
- JS实现别踩白块小游戏
最近有朋友找我用JS帮忙仿做一个别踩白块的小游戏程序,但他给的源代码较麻烦,而且没有注释,理解起来很无力,我就以自己的想法自己做了这个小游戏,主要是应用JS对DOM和数组的操作. 程序思路:如图:将游 ...
- 原生javascript开发仿微信打飞机小游戏
今天闲来无事,于是就打算教一个初学javascript的女童鞋写点东西,因此为了兼顾趣味性与简易程度,果断想到了微信的打飞机小游戏.. 本来想用html5做的,但是毕竟人家才初学,连jquery都还不 ...
- 一个简单的基于canvas小游戏
GDOI2016是我的退役战,不知道是题目画风不对,还是我自身的问题. 不过没关系啦,反正已经进过一次队OI生涯就没有什么遗憾的了. 这几天尝试着去做了个所谓的html5小游戏,略显简陋,但还是写个总 ...
- JS小游戏:贪吃蛇(附源码)
javascript小游戏:贪吃蛇 此小游戏采用的是面向对象的思想,将蛇,食物,和游戏引擎分为3个对象来写的. 为方便下载,我把js写在了html中, 源码中暂时没有注释,等有空我在添加点注释吧. 游 ...
- 使用JavaScript实现简单的小游戏-贪吃蛇
最近初学JavaScript,在这里分享贪吃蛇小游戏的实现过程, 希望能看到的前辈们能指出这个程序的不足之处. 大致思路 首先要解决的问题 随着蛇头的前进,尾巴也要前进. 用键盘控制蛇的运动方向. 初 ...
随机推荐
- KVO 使用及原理
KVO的基本原理大概是这样的 当一个对象被观察时, 系统会新建一个子类NSNotifying_A ,在子类中重写了对象被观察属性的 set方法, 并且改变了该对象的 isa 指针的指向(指向了新 ...
- Selenium三种等待元素的方式及代码,需要特别注意implicitlyWait的用法
一.显式等待 1.显式等待: 就是明确的要等到某个元素的出现或者是某个元素的可点击等条件,等不到,就一直等,除非在规定的时间之内都没找到,那么就跳出Exception. 2.代码: new WebDr ...
- 修改testng源码,添加beforeMethod和afterMethod中的日志到test中(可以不改源码,废弃)
在使用testng生成报告的时候,只会记录test方法中的日志,但是一般会在beforeMethod.beforeTest.afterMethod.afterTest中做一下数据的处理,这里面的日志没 ...
- 51nod 1943 联通期望 题解【枚举】【二进制】【概率期望】【DP】
集合统计类期望题目. 题目描述 在一片大海上有 \(n\) 个岛屿,规划建设 \(m\) 座桥,第i座桥的成本为 \(z_i\),但由于海怪的存在,第 \(i\) 座桥有 \(p_i\) 的概率不能建 ...
- @PostConstruct和@PreConstruct注解
@PostConstruct和@PreConstruct.这两个注解被用来修饰一个非静态的void()方法.而且这个方法不能有抛出异常声明. @PostConstruct //方式1 public v ...
- appium解决无法通过name属性识别元素org.openqa.selenium.InvalidSelectorException: Locator Strategy 'name' is not supported for this session
执行代码.: public AndroidDriver<AndroidElement> appiumDriver; appiumDriver.findElement(By.name(&qu ...
- Ionic3,组件的使用(四)
说明 因为同样是作为 Ionic3 小白,所以很多东西都是自己摸索出来的,可能有很多不合理的地方,请多多指正. 效果图 细节说明 一:组件.页面均采用 懒加载: 二:页面的头部标题栏,采用了组件化的方 ...
- SpringBoot + Quartz定时任务示例
程序文件结构,如下图,后面详细列出各文件的代码: 1. maven的pom.xml文件如下: <project xmlns="http://maven.apache.org/POM/4 ...
- touch插件
第一种: <script> (function($) { var options, Events, Touch; options = { x: 20, y: 20 }; Events = ...
- stm32CubeMx 实现单通道ADC DMA采集
今天要做的是ADC单通道DMA采集实验 MCU : STM32F429 开发工具:STM32CubeMx 版本号 5.0.0 实验目的:实现ADC1 13通道 DMA采集 一 :简介 首先,我们来看一 ...