js案例
林剑南
成功的路上总是离不开贵人的帮助,名师的指点和小人的刺激。菜鸟段位--初学乍练--初窥门径--略有小成--心领神会--融汇贯通---炉火纯青
展开
-
js原型相互调用
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> 0000000ss </body> <script> /*function Perso...翻译 2019-04-10 16:28:07 · 598 阅读 · 0 评论 -
offset讲解
<body> <div id="dv"> <div id="dv1"></div> </div> <input type="button" value="显示效果" id="btn" /> </body> <script> function mm(id){ ...原创 2019-04-01 10:58:19 · 919 阅读 · 0 评论 -
js美女时钟
<body> <img src="meimei/00_00.jpg" id="im" /> </body> <script> function f1(){ //获取当前日期 var dt=new Date(); var hour=dt.getHours(); var second=dt.getSeconds(); //...翻译 2019-03-27 11:58:04 · 441 阅读 · 0 评论 -
js实例化与构造函数的关系
<body> 111 <script> /* * 自定义构造函数------实例化对象 * 实例化与构造函数的关系: * 1,实例化是通过构造函数来创建的-----创建过程叫实例化 * 2.如何判断对象是不是这个数据类型? * 对象 instanceof 构造函数名字 */ //构造函数 functi...翻译 2019-04-04 15:48:17 · 545 阅读 · 0 评论 -
js漫天小星星
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <style> div{ width: 500px; height: 500px; border: 1px so...原创 2019-03-26 14:42:13 · 135 阅读 · 0 评论 -
js定时器
<body> <input type="button" value="ddd" id="box" /> </body> <script> /* * 定时器: * 参数1:函数 * 参数2:时间--毫秒===1000毫秒---1秒 * */ var timeid=setInterval(function ...翻译 2019-03-26 12:02:16 · 169 阅读 · 0 评论 -
js两种定时器
<body> <input type="button" id="btn" value="1111" /> </body> <script> /* * 常用的,反复执行 * window.setInterval(function(){alert("1")},1000) window.clearInterval("定时器...原创 2019-03-28 14:13:57 · 469 阅读 · 0 评论 -
js随机数
<script> (function (window){ //随机产生构造函数 function Random(){ } Random.prototype.getRandom=function(min,max){ return Math.floor(Math.random()*(max-min)+min); }; /* va...原创 2019-04-13 18:02:06 · 118 阅读 · 0 评论 -
js原型的作用demo
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> <script> /*原型的作用:数据共享 * 不需要共享的数据写在...翻译 2019-04-09 23:13:58 · 1001 阅读 · 0 评论 -
js创建对象三种方式与工厂模式对比
<script> /* * 创建对象三种方式: * 1, */ //1.实例对象 /*var per1={ name:"卡卡西"; age:20; sex:"男"; eat:function(){ console.log("吃1111") }, readBook:function(){...翻译 2019-04-03 14:57:38 · 163 阅读 · 0 评论 -
js毫秒数转时间
<body> <script> var dt=new Date(); console.log(dt.valueOf()); var dd=new Date(dt.valueOf()) console.log(dd) </script> </body>原创 2019-04-02 16:47:42 · 937 阅读 · 0 评论 -
js点击透明
div{ width: 300px; height: 300px; background-color: blueviolet; } </style> <body> <div id="dv"></div> <input type="button" value="渐变" id="box"/>...原创 2019-03-29 14:33:11 · 709 阅读 · 0 评论 -
js切换案例
<body> <div class="box" id="box"> <div class="hd"> <span class="current">1</span> <span>2</span>翻译 2019-03-06 14:14:00 · 328 阅读 · 0 评论 -
js移除属性
一、效果代码<style> div{ width:100px; height: 100px; background-color: red; } .clsP{ background-color: #00FF00; } </style> <body> <input type="button" value=...原创 2019-03-06 11:39:09 · 7942 阅读 · 0 评论 -
点击按钮放大图片效果
点击按钮放大图片效果<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!--<a href='img原创 2019-02-21 11:11:11 · 1198 阅读 · 0 评论 -
js获取元素方式总结
一、根据id属性的值获取元素,返回来的是一个元素对象document.getElementById(“id属性的值”);根据标签名字获取元素,返回来的是一个伪数组,里面保存了多个的DOM对象document.getElementsByTagName(“标签名字”);下面的需要ie9以上支持,新增h5特性根据name属性的值获取元素,返回来的是一个伪数组,里面保存了多个的DOM对...转载 2019-03-02 15:26:15 · 1659 阅读 · 0 评论 -
JavaScript点击按钮开关灯案例
<style> .cls{ background-color: brown; } </style> <body id="dd"> <input type="button" value="开/关灯" id="btn"/> <script> function my原创 2019-02-26 10:55:26 · 2771 阅读 · 0 评论 -
JavaScript点击按钮隐藏和显示div方法
根据id 按钮获取点击事件,添加事件处理函数效果:<style> #dv{ width: 100px; height: 100px; background-color: royalblue; } </style> <body> <input type="button" value="隐藏" id="btn"/&原创 2019-02-26 10:37:48 · 21049 阅读 · 1 评论 -
js自定义属性
一、效果二、代码<body> <ul> <li>语文成绩</li> <li>数学成绩</li> <li>化学成绩</li> <li>地理成绩</li> <原创 2019-03-05 12:42:23 · 220 阅读 · 1 评论 -
js小案例按钮排它功能
一、效果点击按钮文字改变二、代码 <input type="button" value="显示效果" /> <input type="button" value="显示效果" /> <input type="button" value="显示效果" /> &原创 2019-02-20 13:24:02 · 324 阅读 · 0 评论 -
js根据name值获取元素
效果 <body> <input type="button" id="btn" value="显示效果" /> <input type="text" value="你是" name="name1" /> <input type="text" value="原创 2019-03-01 16:41:23 · 77385 阅读 · 0 评论 -
点击按钮改变样式
效果代码<body> <input type="button" id="btn" value="样式设置" /> <div id="dv"></div> <script> function my(id){ return document.getElementB原创 2019-02-25 14:03:30 · 6400 阅读 · 0 评论 -
js隔行换色
效果:<body> <input type="button" id="btn" value="点击变色"/> <ul id="gh"> <li>红旗</li> <li>五菱宏光</li> <l原创 2019-02-28 13:31:15 · 211 阅读 · 0 评论 -
js画册案例
效果:代码:<body><h2> 美女画廊</h2><ul id="imagegallery"> <li><a href="img/1.jpg" title="美女A"> <img src="img/1-small.jpg&qu翻译 2019-02-27 15:08:02 · 623 阅读 · 0 评论 -
js模拟京东搜索框
<input type="text" value="请输入内容" id="btn"/> <script> function my(id){ return document.getElementById(id); } //获取焦点事件 my("btn").onfocus=function(){ if(this.value==&quo原创 2019-03-04 11:14:39 · 688 阅读 · 0 评论 -
js不同浏览器兼容innerText属性
<input type="button" value="请输入内容" id="btn"/> <div id="dv">232</div> <script> function my(id){ return document.getElementById(id); } //设置标签中的文本原创 2019-03-04 13:48:51 · 867 阅读 · 0 评论 -
js判断用户浏览器的类型
//判断用户浏览器的类型console.log(window.navigator.userAgent);//判断浏览器所在的系统平台类型console.log(window.navigator.platform)原创 2019-03-25 13:56:36 · 367 阅读 · 0 评论 -
js获取任意一个父级元素的最后一个子级元素和第一个元素兼容浏览器
</head> <ul id="uu"> <li>111</li> <li>222</li> <li>333</li> <li>444</li> <li>55翻译 2019-03-13 14:48:01 · 9559 阅读 · 0 评论 -
js为同一个元素注册多个事件
<body> <input type="button" id="btn" value="11111" /> </body> <script> function mm(id){ return document.getElementById(id); } mm("btn").onclick=f1; mm("btn")...转载 2019-03-21 17:28:59 · 839 阅读 · 0 评论 -
js只能创建一个元素
<body> <input type="button" value="创建元素" id="btn"/> <div id="dv"></div> <script> function mm(id){ return document.getElementById(i翻译 2019-03-16 12:04:25 · 159 阅读 · 0 评论 -
js事件冒泡与阻止冒泡
<div id="dv"> <div id="dv1"> <div id="dv2"></div> </div> </div> </body> <script> function mm(id){ return document.getElementByI...翻译 2019-03-20 14:00:24 · 286 阅读 · 0 评论 -
通过节点操作元素背景色
<input type="button" value="变色" id="btn" /><div id="dv"> <span>111</span> <p>22222</p> <span>333333</span&a原创 2019-03-11 16:44:27 · 226 阅读 · 0 评论 -
js自动创建列表
<input type="button" value="kkk" id="btn"/> <div id="dv"></div> <script> function mm(id){ return document.getElementById(id) } var gongfu=[&原创 2019-03-15 17:37:22 · 780 阅读 · 0 评论 -
js创建元素案例
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <input type="button"转载 2019-03-14 15:37:41 · 224 阅读 · 0 评论 -
浏览器出现Cannot set property 'onclick' of null的问题
一、代码 <input type="button" value="禁用文本框" id="btn0" /> <input type="text" value="文本框" id="txt" /> <script> function documy(id){ return docu原创 2019-03-07 10:53:01 · 2811 阅读 · 1 评论 -
js点击按钮修改性别
点击按钮修改性别 <body> <input type="button" value="修改性别" id="btn"/> <input type="checkbox" value="男" name="sex" id="nan" />男 <input ty原创 2019-02-22 10:58:46 · 1305 阅读 · 0 评论