需要准备的材料分别有：电脑、html编辑器、浏览器。
1、首先，打开html编辑器，新建html文件，例如：index.html，填写问题基础代码。
2、在index.html中的<script>标签，输入js代码：$('img').attr('src', 'https://www.baidu.com/img/bd_logo1.png')。
3、浏览器运行index.html页面，此时网页上的所有图片都被替换成了指定的图片。
js实现更换图片：<script language =javascript >
var curIndex=0
//时间间隔 单位毫秒
var timeInterval=5000
var arr=new Array()
arr[0]="1.jpg"
arr[1]="2.jpg"
arr[2]="3.jpg"
arr[3]="4.jpg"
arr[4]="5.jpg"
arr[5]="6.jpg"
arr[6]="7.jpg"
setInterval(changeImg,timeInterval)
function changeImg()
{
var obj=document.getElementById("showpic")
if (curIndex==arr.length-1)
{
curIndex=0
}
else
{
curIndex+=1
}
obj.src="image/"+arr[curIndex]
}
</script>
<img src="image/1.jpg" width="427" height="219" id="showpic" />
自动更换图片，这个是用定时器做的。下面是简单的代码，仅供参考：
<style>*{ margin:0 padding:0 list-style:none}
#box{ width:840px border:1px solid #000 height:210px margin:30px auto position:relative overflow:hidden}
#box ul{ position:absolute left:0 top:0}
#box ul li{ width:200px height:200px float:left padding:5px}
</style>
<script>
window.onload=function(){
var oBox=document.getElementById('box')
var oUl=oBox.children[0]
var aLi=oUl.children
//复制一份内容
oUl.innerHTML+=oUl.innerHTML
oUl.style.width=aLi.length*aLi[0].offsetWidth+'px'
setInterval(function(){
var l=oUl.offsetLeft+10
if(l>=0){
l=-oUl.offsetWidth/2
}
oUl.style.left=l+'px'
},30)
}
</script>
</head>
<body>
<div id="box">
<ul>
<li><img src="img/1.jpg" width="200"></li>
<li><img src="img/2.jpg" width="200"></li>
<li><img src="img/3.jpg" width="200"></li>
<li><img src="img/4.jpg" width="200"></li>
</ul>
</div>
简单的说一下定时器：
setInterval定义和用法
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
语法
setInterval(code,millisec[,"lang"])
参数
code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。
