函数修改问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>练习</title>
<style>
*{font-size:12px}
dl{width:400px;height:30px;border:1px solid #EEE;line-height:30px;margin:40px auto;}
dd,dt{float:left;margin:0 10px}
dt{margin-left:15px}
dl dd a{display:block;padding:0px 20px;text-decoration:none;position:relative}
dl dd a:hover{color:red;text-decoration:underline;}
.selected{background-color:blue;}
</style>
<script>
var dd=document.getElementsByTagName("dd")
function app(){
for(i=0;i<dd.length;i++){
dd[0].className="selected";
dd[1].className=""
dd[2].className=""
}
}
function bpp(){
for(i=0;i<dd.length;i++){
dd[0].className="";
dd[1].className="selected"
dd[2].className=""
}
}
function cpp(){
for(i=0;i<dd.length;i++){
dd[0].className="";
dd[1].className=""
dd[2].className="selected"
}
}
</script>
</head>
<body>
<dl>
<dt>配送类型：</dt>
<dd class="selected" onclick="app()"><a href="#">全部</a></dd>
<dd onclick="bpp()"><a href="#">京东配送</a></dd>
<dd onclick="cpp()"><a href="#">第三方配送</a></dd>
</dl>
</body>
</html>这样写很麻烦，能不能简化成简单的写法，就是js改写成一个函数，该怎样写？
qq_小白_7浏览 1447回答 2
2回答
-
李晓健
<script> var dd=document.getElementsByTagName("dd") function app(el){ for(i=0;i<dd.length;i++){ dd[0].className=""; dd[1].className="" dd[2].className="" } el.className="selected"; } </script> </head> <body> <dl> <dt>配送类型：</dt> <dd class="selected" onclick="app(this)"><a href="#">全部</a></dd> <dd onclick="app(this)"><a href="#">京东配送</a></dd> <dd onclick="app(this)"><a href="#">第三方配送</a></dd> </dl> </body>上面那个写错了 -
李晓健
<script> var dd=document.getElementsByTagName("dd") function app(type,el){ for(i=0;i<dd.length;i++){ dd[0].className=""; dd[1].className="" dd[2].className="" } el.className="selected"; } </script> </head> <body> <dl> <dt>配送类型：</dt> <dd class="selected" onclick="app(this)"><a href="#">全部</a></dd> <dd onclick="app(this)"><a href="#">京东配送</a></dd> <dd onclick="app(this)"><a href="#">第三方配送</a></dd> </dl> </body>可以试试
随时随地看视频慕课网APP
相关分类
JavaScript