javascript实现点击按钮切换轮播图功能


Posted in Javascript onSeptember 23, 2020

本文实例为大家分享了js实现点击按钮切换轮播图的具体代码,供大家参考,具体内容如下

菜单区域实现

划过主菜单显示子菜单

轮播区域实现

1、点击图片中左右箭头,分别跳转上一张与下一张

(1)点击上一张图其实就是让一个变量进行递减,点击下一张图就是让变量递增;(控制索引最大最小值)

2、点击右下角小圆也可以进行图片的跳转

(1)通过索引让变量进行随意的修改

3、每间隔3s进行轮播图的自动切换,鼠标放在图片上清除自动切换

(1)定时器

4、鼠标放在主菜单上显示子菜单,离开子菜单消失。

放在子菜单上显示子菜单,离开消失。

源代码:

html

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>轮播图</title>
 <link rel="stylesheet" type="text/css" href="css/style.css" />
 <script type="text/javascript" src="js/script.js"></script>
</head>
<body>
 <div class="main" id="main">
 <!-- 主菜单背景 -->
 <div class="menu-box"></div>
 <!-- 主菜单 -->
 <div class="menu-content" id="menu-content">
 <div class="menu-item">
 <a href="">
 <span>手机、配件</span>
 <i class="icon"></i>
 </a>
 </div>
 <div class="menu-item">
 <a href="">
 <span>电脑</span>
 <i class="icon"></i>
 </a>
 </div>
 <div class="menu-item">
 <a href="">
 <span>家用电器</span>
 <i class="icon"></i>
 </a>
 </div>
 <div class="menu-item">
 <a href="">
 <span>家具</span>
 <i class="icon"></i>
 </a>
 </div>
 </div>
 <!-- 子菜单 -->
 <div class="sub-menu hide" id="sub-menu">
 <!-- 子菜单背景 -->
 <div class="inner-box">
 <!-- 子菜单内容 -->
 <div class="sub-inner-box">
 <div class="title">手机、配件</div>
 <div class="sub-row">
 <span class="bold mr10">手机通讯:</span>
 <a href="">手机</a>
 <span class="ml10 mr10">/</span>
 <a href="">手机维修</a>
 <span class="ml10 mr10">/</span>
 <a href="">以旧换新</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">手机配件:</span>
 <a href="">手机壳</a>
 <span class="ml10 mr10">/</span>
 <a href="">手机储蓄卡</a>
 <span class="ml10 mr10">/</span>
 <a href="">数据线</a>
 <span class="ml10 mr10">/</span>
 <a href="">充电器</a>
 <span class="ml10 mr10">/</span>
 <a href="">电池</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">运营商:</span>
 <a href="">中国联通</a>
 <span class="ml10 mr10">/</span>
 <a href="">中国移动</a>
 <span class="ml10 mr10">/</span>
 <a href="">中国电信</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">智能设备:</span>
 <a href="">智能手环</a>
 <span class="ml10 mr10">/</span>
 <a href="">智能家居</a>
 <span class="ml10 mr10">/</span>
 <a href="">智能手表</a>
 <span class="ml10 mr10">/</span>
 <a href="">其他配件</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">娱乐:</span>
 <a href="">耳机</a>
 <span class="ml10 mr10">/</span>
 <a href="">音响</a>
 <span class="ml10 mr10">/</span>
 <a href="">收音机</a>
 <span class="ml10 mr10">/</span>
 <a href="">麦克风</a>
 </div>
 </div>
 </div>
 <div class="inner-box">
 <div class="sub-inner-box">
 <div class="title">电脑</div>
 <div class="sub-row">
 <span class="bold mr10">电脑:</span>
 <a href="">笔记本</a>
 <span class="ml10 mr10">/</span>
 <a href="">平板</a>
 <span class="ml10 mr10">/</span>
 <a href="">一体机</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">电脑配件:</span>
 <a href="">显示器</a>
 <span class="ml10 mr10">/</span>
 <a href="">CPU</a>
 <span class="ml10 mr10">/</span>
 <a href="">主板</a>
 <span class="ml10 mr10">/</span>
 <a href="">硬盘</a>
 <span class="ml10 mr10">/</span>
 <a href="">电源</a>
 <span class="ml10 mr10">/</span>
 <a href="">显卡</a>
 <span class="ml10 mr10">/</span>
 <a href="">其他配件</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">游戏设备:</span>
 <a href="">游戏机</a>
 <span class="ml10 mr10">/</span>
 <a href="">耳机</a>
 <span class="ml10 mr10">/</span>
 <a href="">游戏软件</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">网络产品:</span>
 <a href="">路由器</a>
 <span class="ml10 mr10">/</span>
 <a href="">网络机顶盒</a>
 <span class="ml10 mr10">/</span>
 <a href="">交换机</a>
 <span class="ml10 mr10">/</span>
 <a href="">存储卡</a>
 <span class="ml10 mr10">/</span>
 <a href="">网卡</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">外部产品:</span>
 <a href="">鼠标</a>
 <span class="ml10 mr10">/</span>
 <a href="">键盘</a>
 <span class="ml10 mr10">/</span>
 <a href="">U盘</a>
 <span class="ml10 mr10">/</span>
 <a href="">移动硬盘</a>
 <span class="ml10 mr10">/</span>
 <a href="">鼠标垫</a>
 <span class="ml10 mr10">/</span>
 <a href="">电脑清洁</a>
 </div>
 </div>
 </div>
 <div class="inner-box">
 <div class="sub-inner-box">
 <div class="title">家用电器</div>
 <div class="sub-row">
 <span class="bold mr10">电视:</span>
 <a href="">国产品牌</a>
 <span class="ml10 mr10">/</span>
 <a href="">韩国品牌</a>
 <span class="ml10 mr10">/</span>
 <a href="">欧美品牌</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">空调:</span>
 <a href="">显示器</a>
 <span class="ml10 mr10">/</span>
 <a href="">柜式</a>
 <span class="ml10 mr10">/</span>
 <a href="">中央</a>
 <span class="ml10 mr10">/</span>
 <a href="">壁挂式</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">冰箱:</span>
 <a href="">多门</a>
 <span class="ml10 mr10">/</span>
 <a href="">对开门</a>
 <span class="ml10 mr10">/</span>
 <a href="">三门</a>
 <span class="ml10 mr10">/</span>
 <a href="">双门</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">洗衣机:</span>
 <a href="">滚筒式洗衣机</a>
 <span class="ml10 mr10">/</span>
 <a href="">迷你洗衣机</a>
 <span class="ml10 mr10">/</span>
 <a href="">洗烘一体机</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">厨房电器:</span>
 <a href="">抽烟机</a>
 <span class="ml10 mr10">/</span>
 <a href="">洗碗机</a>
 <span class="ml10 mr10">/</span>
 <a href="">燃气灶</a>
 </div>
 </div>
 </div>
 <div class="inner-box">
 <div class="sub-inner-box">
 <div class="title">家具</div>
 <div class="sub-row">
 <span class="bold mr10">家纺:</span>
 <a href="">被子</a>
 <span class="ml10 mr10">/</span>
 <a href="">枕头</a>
 <span class="ml10 mr10">/</span>
 <a href="">四件套</a>
 <span class="ml10 mr10">/</span>
 <a href="">床垫</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">灯具:</span>
 <a href="">台灯</a>
 <span class="ml10 mr10">/</span>
 <a href="">顶灯</a>
 <span class="ml10 mr10">/</span>
 <a href="">节能灯</a>
 <span class="ml10 mr10">/</span>
 <a href="">应急灯</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">厨具:</span>
 <a href="">烹饪锅具</a>
 <span class="ml10 mr10">/</span>
 <a href="">餐具</a>
 <span class="ml10 mr10">/</span>
 <a href="">菜板刀具</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">家装:</span>
 <a href="">地毯</a>
 <span class="ml10 mr10">/</span>
 <a href="">沙发垫套</a>
 <span class="ml10 mr10">/</span>
 <a href="">装饰字画</a>
 <span class="ml10 mr10">/</span>
 <a href="">照片墙</a>
 <span class="ml10 mr10">/</span>
 <a href="">窗帘</a>
 </div>
 <div class="sub-row">
 <span class="bold mr10">生活日用:</span>
 <a href="">收纳用品</a>
 <span class="ml10 mr10">/</span>
 <a href="">浴室用品</a>
 <span class="ml10 mr10">/</span>
 <a href="">雨伞雨衣</a>
 </div>
 </div>
 </div>
 </div>
 <!-- 焦点图 -->
 <div class="banner" id="banner">
 <!-- 鼠标悬停停止自动轮播的区域 -->
 <section class="cease" id="cease"></section>
 <a href="">
 <div class="banner-slide slide1"></div>
 </a>
 <a href="">
 <div class="banner-slide slide2"></div>
 </a>
 <a href="">
 <div class="banner-slide slide3"></div>
 </a>
 </div>
 <!-- 按钮 -->
 <a href="javascript:void(0)" class="button prev" id="prev"></a>
 <a href="javascript:void(0)" class="button next" id="next"></a>
 <div class="dots" id="dots">
 <span class="active"></span>
 <span></span>
 <span></span>
 </div>
 </div>
</body>
</html>

css

*{
 margin: 0;
 padding: 0;
}
/*通配符选择器,外边距,内边距为0*/
body{
 font-family: "微软雅黑";
 color: #14191e;
}
/*字体,字体颜色*/
@font-face{
 font-family: 'iconfont';/*自定义名称,要有意义,不准数字*/
 src: url('../font/iconfont.eot');/*兼容ie9以上版本*/
 src: url('../font/iconfont.eot?#iefix') format('embedded-opentype'),/*兼容ie6-8版本*/
 url('../font/iconfont.ttf') format('truetype'),/*主要针对手机端浏览器 safari android ios*/
 url('../font/iconfont.woff') format('woff'),/*兼容所有浏览器 */
 url('../font/iconfont.svg#iconfont') format('svg');/*针对ios端开发 legacy ios*/
/* font-weight: bold;<字体加粗>
 font-style: normal;默认的正常显示*/
}
/*获取下载的字体*/
a{
 text-decoration: none;
}
/*没有下划线*/
a:link,a:visited{
 color: #5e5e5e;
}
/*联合选择器,未访问连接时与已经访问链接时的字体颜色*/
.main{
 width: 1200px;
 height: 460px;
 margin: 30px auto;
 overflow: hidden;
 position: relative;
}
/*最大框架:宽;高;外边距,上下30px,左右居中;溢出的部分隐藏;相对定位*/
.banner{
 width: 1200px;
 height: 460px;
 overflow: hidden;
 cursor: pointer;
}
/*焦点图:宽;高;溢出的部分隐藏;小手标志*/
.banner-slide{
 width: 1200px;
 height: 460px;
 float: right;
 background-repeat: no-repeat;
 display: none;
}
/*三个图片:宽;高;右浮动,背景不重复;全部隐藏*/

.slide1{
 background-image: url(../img/bg1.jpg);
 display: block;
}
/*第一个图片;块级元素显示*/
.slide2{
 background-image: url(../img/bg2.jpg);
}
/*第二个图片*/
.slide3{
 background-image: url(../img/bg3.jpg);
}
/*第三个图片*/
.button{
 position: absolute;
 width: 40px;
 height: 80px;
 right: 0;
 background: url(../img/arrow.png) center center no-repeat;
 top: 50%;
 margin-top: -40px;
}
/*左右两个按钮;宽;高;相对main绝对定位,距右0,距上50%;背景图片,水平垂直居中,不重复;外上边距-40px;*/
.button:hover{
 background-color: #333;
 opacity: 0.8;
 filter: alpha(opacity=80);
}
/*鼠标悬浮在上面时状态:背景颜色,透明度。照顾IE浏览器*/
.prev{
 left: 244px;
 -webkit-transform: rotate(180deg);
 -moz-transform: rotate(180deg);
 -ms-transform: rotate(180deg);
 -o-transform: rotate(180deg);
 transform: rotate(180deg);
}
/*左按钮相对上面:靠左244px,定位左的优先级高于右;旋转180度*/
.dots{
 position: absolute;
 right: 24px;
 bottom: 24px;
 line-height: 12px;
}
/*下面三个选择圆:相对main绝对定位,距右,距下,行间距12px;*/
.dots span{
 display: inline-block;
 width: 12px;
 height: 12px;
 border-radius: 50%;
 background-color: rgba(7,17,27,.4);
 margin-left: 8px;
 box-shadow: 0 0 0 2px rgba(255,255,255,.8) inset;
 cursor: pointer;
}
/*子孙后代选择器:转换为块级元素并列一排;宽;高;削圆;背景颜色;外左边距,让他们之间有距离;盒子阴影,水平偏移量,垂直偏移量,模糊度,扩展多少,颜色模糊度,内阴影;小手标志*/
.dots .active{
 background-color: #fff;
 box-shadow: 0 0 0 2px rgba(255,255,255,.4) inset;
}
/*背景颜色,同上*/
.menu-box{
 position: absolute;
 left: 0;
 top: 0;
 width: 244px;
 height: 460px;
 background: rgba(7,17,27,.3);
 z-index: 1;
}
/*主菜单背景,相对main绝对定位,左上偏移;宽;高;背景颜色模糊度;层叠模式数字大的在上面显示*/
.menu-content{
 position: absolute;
 left: 0;
 top: 0;
 width: 244px;
 height: 460px;
 z-index: 2;
}
/*主菜单(因为菜单不需要模糊度所以单独拿出来设置css样式)*/
.menu-item{
 height: 64px;
 line-height: 66px;
 cursor: pointer;
 padding: 0 24px;
}
/*主菜单的每个标题,宽;行间距;因为是链接,浮在上面显示小手标志;内边距,上下0,左右24px;下划线两边留空*/
.menu-item a{
 display: block;
 color: #fff;
 font-size: 16px;
 border-bottom: 1px solid rgba(255,255,255,.2);
 height: 63px;
 position: relative;
}
/*转换为块级元素;字体颜色;字体大小;下边框,粗细,实线,颜色透明度;高;相对定位*/
.menu-item:last-child a{
 border-bottom:none;
}
/*menu-item的最后一个元素a;没有下边框*/
.menu-item i{
 position: absolute;
 right: 12px;
 top: 2px;
 color: rgba(255,255,255,.5);
 font-style: normal;
 font-weight: normal;
 font-family: "iconfont";
 font-size: 24px;
}
/*子孙后代选择器:相对a绝对定位;右下偏移;字体颜色模糊度;没有斜体;没有加粗;字体;字体大小*/
.sub-menu{
 width: 730px;
 height: 458px;
 position: absolute;
 left: 244px;
 top: 0;
 background: #fff;
 z-index: 50;
 border: 1px solid #d9dde1;
 box-shadow: 0 4px 8px 0px rgba(0,0,0,.1);
}
/*子菜单:宽;高;相对main绝对定位,左上偏移;背景颜色;层叠模式数字大的在上面显示;边框;盒子阴影*/
.inner-box{
 width: 100%;
 height: 100%;
 background: url(../img/fe.png);
 display: none;
}
/*子菜单背景:宽;高;背景图片;全部隐藏*/
.sub-inner-box{
 width: 652px;
 margin-left: 40px;
 overflow: hidden;
}
/*子菜单内容;宽;外左边距;溢出的内容隐藏*/
.title{
 font-size: 16px;
 color: #f01414;
 line-height: 16px;
 font-weight: bold;
 margin: 28px 0 30px 0;
}
/*子菜单内容的标题:字体大小;颜色;行高;粗体;外边距*/
.sub-row{
 margin-bottom: 25px;
}
/*子菜单内容:外下边距让他们之间有距离*/
.bold{
 font-weight: bold;
}
/*子标题:字体加粗*/
.ml10{
 margin-left: 10px;
}
/*内容和斜杠之间的左边距离*/
.mr10{
 margin-right: 10px;
}
/*内容、子标题和斜杠之间的右边距离*/
.hide{
 display: none;
}
/*隐藏子菜单*/

js

// 声明全局变量
window.onload=function(){
 var index = 0,//当前显示图片的索引,默认值为0
 timer = null, //定时器
 cease = byId("cease"),//鼠标悬停停止自动轮播的区域
 prev = byId("prev"),//上一张
 next = byId("next"),//下一张
 banner = byId("banner"),//焦点图的爷爷
 pics = banner.getElementsByTagName('div'),//焦点图
 dots = byId("dots").getElementsByTagName('span'),//圆点
 menuContent = byId("menu-content"),//主菜单
 menuItems = menuContent.getElementsByClassName("menu-item"),//主菜单的标题
 subMenu = byId("sub-menu"),//子菜单
 innerBox = subMenu.getElementsByClassName("inner-box"),//子菜单的标题
 mlen = menuItems.length,
 size = pics.length,
 llen = innerBox.length;
 // console.log(size);




console.log(lis_1[0]);
lis_1[0].onclick = function(){
 department.className = 'hide'
 hospital.className = 'hospital'
 lis_1[0].className = 'li_1'
}
lis_1[1].onclick = function(){
 department.className = ''
 hospital.className = 'hospital hide'
 lis_1[1].className = 'li_1'
}


//封装getElementById()三元运算符
function byId(id){
 return typeof(id) === "string" ? document.getElementById(id):id;
}

/*封装通用事件绑定方法;
 element绑定事件的DOM元素
 事件名
 事件处理程序
*/
function addHandler(element,type,handler){
 //针对非IE浏览器
 if (element,addEventListener) {
 element.addEventListener(type,handler,true);
 } //IE浏览器支持DOM2级
 else if (element,attachEvent) {
 element.attachEvent('on' + type,handler);
 } //IE浏览器不支持DOM2级,使用DOM0级
 else{
 element['on' + type] = handler;
 //变量不可以.type,事件可以.;
 }
}

//封装函数,切换图片
function changImg(){
 //遍历所有图片,将图片隐藏,将圆点上的类清除
 for(var i=0;i<size;i++){
 pics[i].style.display = 'none';
 dots[i].className = "";
 }
 //显示当前图片
 pics[index].style.display = 'block';
 //当前圆点高亮显示
 dots[index].className = "active";
}

// 点击下一张按钮显示下一张图片
addHandler(next,"click",function(){
 index++;
 if (index>=size) index = 0;
 changImg();
});

// 点击上一张按钮显示上一张图片
addHandler(prev,"click",function(){
 index--;
 if (index<0) index = size-1;
 changImg();
});

//点击圆点索引切换图片
for(var j=0;j<size;j++){
 dots[j].setAttribute('tid',j);
 addHandler(dots[j],'click',function(){
 //自定义属性不可以直接点,需用getAttribute
 index = this.getAttribute('tid');
 changImg();
 })
}

//定时器,开启自动轮播
function startAutoPlay(){
 timer = setInterval(function(){
 index++;
 if (index>=size) index = 0;
 changImg();
 },3000)
}

//清除定时器,停止自动轮播
function ceaseAutoPlay(){
 if(timer){
 clearInterval(timer);
 }
}

//封装函数,取消所有主菜单背景
function bgNone(){
 for(var n=0;n<mlen;n++){
 menuItems[n].style.background = 'none';
 }
}

//封装函数,子菜单和主菜单背景显示
function menuItemsBg(){
 //显示子菜单所在的背景
 subMenu.className = "sub-menu";
 //获取当前主菜单的索引
 index = this.getAttribute('data-index');
 //遍历所有的子菜单innerbox,将它们隐藏
 for(var l=0;l<llen;l++){
 //隐藏所有的子菜单
 innerBox[l].style.display = "none";
 //所有主菜单取消背景
 menuItems[l].style.background = 'none';
 }
 //找到当前子菜单,让其显示出来
 innerBox[index].style.display = "block";
 //当前主菜单显示背景
 menuItems[index].style.background = 'rgba(0,0,0,.1)';
}

//鼠标滑过主菜单和子菜单
for(var k=0;k<mlen;k++){
 //给所有主菜单定义属性,表明它的索引
 menuItems[k].setAttribute('data-index',k);
 //给所有子菜单定义属性,表明它的索引
 innerBox[k].setAttribute('data-index',k);
 addHandler(menuItems[k],"mouseover",menuItemsBg)
 addHandler(innerBox[k],"mouseover",menuItemsBg)
}

//鼠标滑入子菜单,显示子菜单
addHandler(subMenu,"mouseover",function(){
 subMenu.className = "sub-menu";
})

//鼠标离开主菜单,隐藏子菜单
addHandler(menuContent,"mouseout",function(){
 subMenu.className = "sub-menu hide";
 bgNone(); 
})

//鼠标离开子菜单,隐藏子菜单
addHandler(subMenu,"mouseout",function(){
 subMenu.className = "sub-menu hide";
 bgNone();
})

//鼠标滑入cease,停止轮播
addHandler(cease,"mouseover",ceaseAutoPlay);
//鼠标离开cease,继续轮播
addHandler(cease,"mouseout",startAutoPlay);

//自动开启轮播
startAutoPlay();

}

精彩专题分享:jQuery图片轮播 JavaScript图片轮播 Bootstrap图片轮播

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
免费空间广告万能消除代码
Sep 04 Javascript
javascript 出生日期和身份证判断大全
Nov 13 Javascript
基于jQuery的图片大小自动适应实现代码
Nov 17 Javascript
23个超流行的jQuery相册插件整理分享
Apr 25 Javascript
Javascript继承(上)——对象构建介绍
Nov 08 Javascript
JavaScript实现动态添加,删除行的方法实例详解
Jul 02 Javascript
跨域资源共享 CORS 详解
Apr 26 Javascript
JavaScript中cookie工具函数封装的示例代码
Oct 11 Javascript
jquery replace方法去空格
May 08 jQuery
简述jQuery Easyui一些用法
Aug 01 jQuery
详解微信小程序中组件通讯
Oct 30 Javascript
理理Vue细节(推荐)
Apr 16 Javascript
Vue3为什么这么快
Sep 23 #Javascript
Angular短信模板校验代码
Sep 23 #Javascript
JavaScript实现单点登录的示例
Sep 23 #Javascript
Vue+Java+Base64实现条码解析的示例
Sep 23 #Javascript
通过实例解析jQ Ajax操作相关原理
Sep 23 #Javascript
js实现三角形粒子运动
Sep 22 #Javascript
js操作两个json数组合并、去重,以及删除某一项元素
Sep 22 #Javascript
You might like
用文本文件制作留言板提示(上)
2006/10/09 PHP
php 模拟POST提交的2种方法详解
2013/06/17 PHP
ThinkPHP入口文件设置及相关注意事项分析
2014/12/05 PHP
Laravel框架中实现使用阿里云ACE缓存服务
2015/02/10 PHP
php使用ob_flush不能每隔一秒输出原理分析
2015/06/02 PHP
用jquery等比例控制图片宽高的具体实现
2014/01/28 Javascript
用JS在浏览器中创建下载文件
2014/03/05 Javascript
WEB前端设计师常用工具集锦
2014/12/09 Javascript
JavaScript插件化开发教程 (一)
2015/01/27 Javascript
jquery验证邮箱格式是否正确实例讲解
2015/11/16 Javascript
Javascript操作表单实例讲解(下)
2016/06/20 Javascript
JavaScript如何获取到导航条中HTTP信息
2017/10/10 Javascript
jQuery+vue.js实现的多选下拉列表功能示例
2019/01/15 jQuery
解决Vue 刷新页面导航显示高亮位置不对问题
2019/12/25 Javascript
nodeJs的安装与npm全局环境变量的配置详解
2020/01/06 NodeJs
[48:26]VGJ.S vs infamous Supermajor 败者组 BO3 第二场 6.4
2018/06/05 DOTA
[01:46]2018完美盛典章节片——坚守
2018/12/17 DOTA
python解决Fedora解压zip时中文乱码的方法
2016/09/18 Python
深入浅析ImageMagick命令执行漏洞
2016/10/11 Python
django框架事务处理小结【ORM 事务及raw sql,customize sql 事务处理】
2019/06/27 Python
python字典的常用方法总结
2019/07/31 Python
英国最大的在线运动补充剂商店:Discount Supplements
2017/06/03 全球购物
ASOS西班牙官网:英国在线时尚和美容零售商
2020/01/10 全球购物
一份Java笔试题
2012/02/21 面试题
文件中有一组整数,要求排序后输出到另一个文件中
2012/01/04 面试题
什么是Oracle的后台进程background processes?都有哪些后台进程?
2012/04/26 面试题
活动邀请函范文
2014/01/19 职场文书
甜美蛋糕店创业计划书
2014/01/30 职场文书
酒店值班经理的工作职责范本
2014/02/18 职场文书
党旗在我心中演讲稿
2014/09/15 职场文书
2014年小学国庆节活动方案
2014/09/16 职场文书
成都人事代理协议书
2014/10/25 职场文书
2014年采购员工作总结
2014/11/18 职场文书
2016年中学端午节主题活动总结
2016/04/01 职场文书
JavaScript中时间格式化新思路toLocaleString()
2021/11/07 Javascript
springboot+zookeeper实现分布式锁
2022/03/21 Java/Android