JavaScript
关注
分享
扫一扫
Vivian_shuang
Be a IT engineer！
展开
-
Date对象
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>scripttype="text/javascript">// Date对象// 记录时间，时间对象varnow = new Date();// alert(now);// 年份获取varyea原创 2016-07-11 08:10:59 · 264 阅读 · 0 评论 -
string对象
DOCTYPE html>html>head>metacharset="utf-8" />title>title>head>body>scripttype="text/javascript">// string对象// 万事万物皆对象// 创建一个字符串varmyStr = new String("hello js");//原创 2016-07-11 08:11:49 · 222 阅读 · 0 评论 -
大图滚动
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">.wrap{position:relative;width:200px;height:200px;overflow:hidden;}#middle{ov原创 2016-07-11 08:12:42 · 280 阅读 · 0 评论 -
数码时钟
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>style type="text/css">html{background-color: black;margin:100pxauto;text-align: center;}#title{color: wh原创 2016-07-11 08:13:54 · 235 阅读 · 0 评论 -
倒计时
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">html{height:500px;background-color: black;padding-top:300px;text-align: center;backgroun原创 2016-07-11 08:14:29 · 254 阅读 · 0 评论 -
运动基础
DOCTYPE html>html>head>metacharset="utf-8" />title>title>styletype="text/css">#div1{width:200px;height:200px;background-color: red;position:absolute;top:50px;原创 2016-07-11 08:15:49 · 293 阅读 · 0 评论 -
offset的小bug
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:200px;height:200px;background-color: red;border:5px solid black;}style>head>原创 2016-07-11 08:16:43 · 329 阅读 · 0 评论 -
物体淡入淡出
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:200px;height:200px;background-color: red;/* 兼容IE的透明度 0 - 1 */filter: alpha(opacity原创 2016-07-11 08:17:16 · 444 阅读 · 0 评论 -
多物体淡入淡出
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:200px;height:200px;background-color: red;margin:20px;float:left;filter:原创 2016-07-11 08:18:54 · 500 阅读 · 1 评论 -
多物体运动
DOCTYPE html>html>head>metacharset="{CHARSET}">title>title>styletype="text/css">div{width:100px;height:50px;margin:10px;background-color: red;}style>head>原创 2016-07-11 08:20:08 · 411 阅读 · 0 评论 -
侧面小广告小例子
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">*{margin:0;padding:0;}#div1{width:150px;height:300px;background-color: red;原创 2016-07-11 08:21:20 · 386 阅读 · 0 评论 -
缓冲运动
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:100px;height:100px;background-color: red;position:absolute;top:50px;/*原创 2016-07-11 08:21:53 · 309 阅读 · 0 评论 -
匀速运动小问题
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:100px;height:100px;background-color: red;position:absolute;top:50px;le原创 2016-07-11 08:22:31 · 292 阅读 · 0 评论 -
获取非行间样式
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">#div1{width:100px;height:200px;background-color: yellow;font-size:50px;}style>head>bod原创 2016-07-11 08:23:15 · 291 阅读 · 0 评论 -
碰壁反弹
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">.wrap{width:1000px;height:400px;border:1px solid black;position:relative;}.ball{width:原创 2016-07-11 08:23:59 · 443 阅读 · 0 评论 -
json小用法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>scripttype="text/javascript">// json// 第二种可以存储多个值的一个变量vararr = [1, {a1:1, a2:2, a3:3}, "3"];// json定义原创 2016-07-11 08:24:39 · 281 阅读 · 0 评论 -
tween
DOCTYPE html>html>head>metacharset="UTF-8">title>title>style>#div1{width:200px;height:200px;background-color:#ccc;position:absolute;top:50px;left:0;}style>h原创 2016-07-11 08:25:14 · 239 阅读 · 0 评论 -
物体变宽变高
DOCTYPE html>html>head>metacharset="utf-8" />title>title>styletype="text/css">div{width:200px;height:200px;background-color: yellow;float:left;margin:20px;b原创 2016-07-11 08:26:07 · 284 阅读 · 0 评论 -
链式运动
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:200px;height:200px;background-color: aquamarine;margin:10px;border:10px solid de原创 2016-07-11 08:26:53 · 307 阅读 · 0 评论 -
任意运动框架
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:200px;height:200px;background-color: aquamarine;margin:10px;border:10px so原创 2016-07-11 08:27:27 · 318 阅读 · 0 评论 -
move.js
// json{key: value}// json{att: iTarget};// 当有一个到达目的地就停止了// 当所有的值都到达目的地才停止function startMove(obj,json, endFn) {clearInterval(obj.timer);obj.timer = setInterval(function() {原创 2016-07-11 08:28:37 · 421 阅读 · 0 评论 -
淘宝大图滚动小例子
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">*{margin:0;padding:0;}.banner{width:520px;height:280px;overflow:hidden;p原创 2016-07-11 08:29:25 · 300 阅读 · 0 评论 -
js基础
DOCTYPE html>html lang="en">head>meta charset="UTF-8">title>Documenttitle>head>body>script>一.script的引入方式1.头部引入2.外部引入（可以在头部，可以在body）3.body闭标签前引入（也叫内部引入）一般写法js的调试方式：1.ale原创 2016-07-11 08:29:57 · 287 阅读 · 0 评论 -
js实现加减乘除
DOCTYPE html>html>head>metacharset="utf-8" />title>title>head>body>inputtype="text" name="input1" id="input1"value="" />inputtype="text" name="input2" id="input2"value=原创 2016-07-11 08:31:23 · 8704 阅读 · 0 评论 -
美元js
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>inputtype="" name=""id="f0" value=""/>inputtype="button" name="" id="f1"value="金额" />scripttype="te原创 2016-07-11 08:33:17 · 260 阅读 · 0 评论 -
js小练习
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>inputtype="text" name="txt1" id="txt1"value="" />inputtype="text" name="txt2" id="txt2"value="" />input原创 2016-07-11 08:34:20 · 364 阅读 · 0 评论 -
行李托运小例子
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>inputtype="text" name="txt" id="txt"value="" />inputtype="button" name="btn" id="btn"value="验证" />// 3.原创 2016-07-11 08:35:00 · 2635 阅读 · 0 评论 -
三角形小练习
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>inputtype="text" name="txt1" id="txt1"value="" />inputtype="text" name="txt2" id="txt2"value="" />inp原创 2016-07-11 08:35:48 · 303 阅读 · 0 评论 -
奇偶数小练习
DOCTYPE html>html>head>metacharset="utf-8" />title>title>head>body>inputtype="text" name="txt1" id="txt1"value="" />inputtype="button" name="btn1" id="btn1"value="验证" /原创 2016-07-11 08:36:26 · 456 阅读 · 0 评论 -
change小练习
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:200px;height:200px;background-color: red;}.div2{opacity:0;transition:1s;/*原创 2016-07-11 08:37:03 · 357 阅读 · 0 评论 -
判断年龄小练习
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>inputtype="text" name="txt1" id="txt1"value="" />inputtype="text" name="txt2" id="txt2"value="" />input原创 2016-07-11 08:37:48 · 895 阅读 · 0 评论 -
经典闭包
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>scripttype="text/javascript">// 闭包的一种经典写法varperson = {};(function(p){p.setName= function(name){this.nam原创 2016-07-22 15:21:36 · 315 阅读 · 0 评论 -
全局变量计数器
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>p>全局变量计数p>button onclick="myFunction()">计数button>p id="demo">0p>scripttype="text/javascript">// 计数器数值在执行add原创 2016-07-22 15:24:28 · 781 阅读 · 0 评论 -
计数器闭包做法
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>p>全局变量计数p>button onclick="myFunction()">计数button>p id="demo">0p>scripttype="text/javascript">// 局部变量的做法 错误做原创 2016-07-22 15:25:17 · 1537 阅读 · 0 评论 -
birthday判断
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>inputtype="text" name="txt1" id="txt1"value="" />inputtype="text" name="txt2" id="txt2"value="" />input原创 2016-07-12 08:19:41 · 299 阅读 · 0 评论 -
js基础小例子
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>inputtype="text" name="txt1" id="txt1"value="" />inputtype="text" name="txt2" id="txt2"value="" /原创 2016-07-12 08:20:50 · 937 阅读 · 0 评论 -
按钮切换
DOCTYPE html>html>head>metacharset="UTF-8">title>title>styletype="text/css">div{width:200px;height:200px;background-color: red;display:none;}.div2{display:block;原创 2016-07-12 08:21:22 · 343 阅读 · 0 评论 -
九九乘法表
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>styletype="text/css">div{width:60px;height:20px;text-align: center;line-height:20px;display:inlin原创 2016-07-12 08:21:58 · 268 阅读 · 0 评论 -
球弹的高度
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>scripttype="text/javascript">// 3. 一个球从100m高度自由落下，每次落地后反跳回原来高度的一半，再落下，再反弹。求它在第10次落地时，共经过多少米？第10次反弹多高var原创 2016-07-12 08:22:41 · 347 阅读 · 0 评论 -
水仙花数
DOCTYPE html>html>head>metacharset="UTF-8">title>title>head>body>scripttype="text/javascript">// 1. 编程将所有“水仙花数”打印出来，并打印其总个数。 “水仙花数”是一个 各个位立方之和等于该整数的三位数。varnum = 0;for原创 2016-07-12 08:23:14 · 277 阅读 · 0 评论