原生js 练习demo
maodoudou.
这个作者很懒,什么都没留下…
展开
-
手风琴菜单—基于原生js
<script type="text/javascript"> //获取所有的span var span = document.getElementsByClassName("menuSpan"); var openDiv = span[0].parentElement; //遍历span for(var i=0 ; i<span.length ; i++){ //为每原创 2020-11-25 14:04:20 · 316 阅读 · 0 评论 -
封装move函数—基于原生JS
// 参数: // obj:要执行动画的对象; // attr:要执行动画的样式,如"left" "top" "height" "width" //target: 执行动画的目标位置 //speed:移动的速度 //callback:回调函数,将在动画执行完毕后执行 // var timer; function move(obj,attr,target,speed,callback){ clea原创 2020-11-24 10:56:56 · 737 阅读 · 0 评论 -
轮播图—基于原生js
<!-- 图片展示区域 --> <div class="outer"> <ul class="imgList"> <li><img src="images/service_pic1.jpg"/></li> <li><img src="images/service_pic2.jpg"/></li> <l原创 2020-11-24 10:53:33 · 118 阅读 · 0 评论 -
数组去重—基于原生JS
<script type="text/javascript"> var arr = [1,1,2,1,2,1,1]; Array.prototype.unique = function(){ var temp = {};//创建一个对象 var newArr = [];//创建一个新数组,用于存储返回新的数组 var len = this.length; for(var原创 2020-11-22 19:02:32 · 93 阅读 · 0 评论 -
键盘移动
<div style="width: 100px;height: 100px;background-color: brown;opacity: 0.8;position: absolute;top: 0;left: 0;"></div> <script type="text/javascript"> var div = document.getElementsByTagName("div")[0]; //设置定时器解决转换方向时卡顿原创 2020-11-22 16:47:14 · 174 阅读 · 0 评论 -
输出九九乘法表—基于原生js
<script type="text/javascript"> //嵌套循环,输出九九乘法表 for(var i=1 ; i<=9 ; i++){ for(var j=1 ; j<=i; j++){ document.write("<span>" + j + "*" + i + "=" + i*j + "</span>"); }原创 2020-11-22 16:46:11 · 121 阅读 · 0 评论 -
图片切换2
<div class="pic_tab"> <p class="info"></p> <div class="pic"> <img src="images/service_pic1.jpg"/> </div> <div class="btn"> <button class="prev">上一张</原创 2020-11-22 16:43:51 · 111 阅读 · 0 评论 -
鼠标拖拽函数—基于原生js
<div style="width: 100px;height: 100px;background-color: brown;opacity: 0.8;position: absolute;top: 0;left: 0;"></div> <script type="text/javascript"> function drag(obj){ // var div = document.getElementsByTagName原创 2020-11-22 16:41:27 · 158 阅读 · 0 评论 -
图片切换—基于原生js
<div class="pic_tab"> <div class="pic"> <img src="images/service_pic1.jpg"/> </div> <div class="btn"> <button class="start">开始</button> <button class="原创 2020-11-22 16:39:36 · 103 阅读 · 0 评论