JS特效就是网页中实现的特殊效果或者特殊的功能的一种技术,是用网页脚本(javascript)来编写制作动态特殊效果。
比如图片切换，渐变等等，它为网页活跃了网页的气氛，有时候会起到一定的亲切力。
JavaScript 是根据 "ECMAScript"标准制定的网页脚本语言。这个标准由 ECMA 组织发展和维护。ECMA-262 是正式的 JavaScript 标准。
扩展资料：
能够具有交互性，能够包含更多活跃的元素，就有必要在网页中嵌入其它的技术。如：Javascript、VBScript、Document Object Model（DOM，文档对象模型）、Layers和 Cascading Style Sheets（CSS，层叠样式表）。
JavaScript 使网页增加互动性。JavaScript 使有规律地重复的HTML文段简化，减少下载时间。JavaScript 能及时响应用户的操作，对提交表单做即时的检查，无需浪费时间交由 CGI 验证。JavaScript 的特点是无穷无尽的，只要你有创意。
1.首先写一个js文件，areaLocation.js:
var
provinceArray=
new
Array()
provinceArray=[
{"pname":"江苏",
"country":[
{
"cname":"南京市",
"town":["玄武区","白下区","秦淮区","建邺区","雨花台","江宁区",
"六合区","溧水县","高淳县"]},
{
"cname":"南通市",
"town":["崇川区","港闸区","启东市","如皋市","通州市","海门市","海安县","如东县"]
},
{
"cname":"苏州市",
"town":["金阊区","沧浪区","平江区","虎丘区","吴中区","张家港","昆山市","吴江市","太仓市"]
}
]
},
{"pname":"上海",
"country":[
{
"cname":"上海市",
"town":["徐汇区","普陀区","杨浦区","虹口区","卢湾区","浦东区","黄浦区","长宁区","闸北区","静安区","闵行区","松江区"]
}
]
}
]
function
areaInitialize(){
province.length=1
for(var
i
=
0i<provinceArray.lengthi++){
var
pro
=
provinceArray[i].pname
province.options[province.length]
=
new
Option(pro,pro)
}
}
function
changeCLocation(id,city){
//alert(id)
city.length
=
0
if(id>0){
var
j=id-1
var
i
var
countrys
=
new
Array()
countrys
=
provinceArray[j].country
city.options[0]
=
new
Option('不限','')
for
(i=0i
<
countrys.length
i++){
var
cname
=
countrys[i].cname
city.options[city.length]
=
new
Option(cname,
cname)
}
changeTLocation(id,1,town)
}else
if(id==0){
city.length
=
0
town.length
=
0
city.options[city.length]
=
new
Option('不限','')
town.options[town.length]
=
new
Option('不限','')
}
}
function
changeTLocation(pid,cid,town){
//alert(cid)
var
countrys
=
new
Array()
var
towns
=
new
Array()
town.length
=
0
var
i
countrys
=
provinceArray[pid-1].country
areaId
=
countrys[cid-1].areaId
towns
=
countrys[cid-1].town
city.options[0]
=
new
Option('不限','')
town.options[0]
=
new
Option('不限','')
for
(i=0i
<
towns.length
i++){
var
tname
=
towns[i]
town.options[town.length]
=
new
Option(tname,tname)
}
town.options[0]
=
new
Option('不限','')
}
2.
再写一个html页面：
<!DOCTYPE
HTML
PUBLIC
"-//W3C//DTD
HTML
4.01
Transitional//EN">
<html>
<head>
<script
type="text/javascript"
></script>
<script
type="text/javascript">
window.onload=areaInitialize()
</script>
</head>
<body>
<select
size="1">
<option
value=0
selected>--请选择--</option>
</select>
<select
size="1"
>
<option
value=0
selected>--请选择--</option>
</select>
<select
size=1>
<option
value=0
selected>--请选择--</option>
</select>
</body>
</html>
<style>#bg img{margin:0 5pxborder:1px solid #dddwidth:80pxheight:80px}
#bg img.on{border-color:#f00}
</style>
<div id="bg">
<img src="缩略图地址" rel="大图地址">
<img src="缩略图地址" rel="大图地址">
<img src="缩略图地址" rel="大图地址">
</div>
//引入jQuery.js
<script>
var $mg=$("#bg").find("img")
$mg.click(function(){
var big=$(this).attr("rel")
$("body").css("background","url("+big+") 50% 50% no-repeat")
$(this).addClass("on").siblings("img").removeClass("on")
})
</script>
上面就是最简单的背景切换加缩略图，需要引入jQuery哈
