关于JS控制A标签样式的问题

发布网友

我来回答

共1个回答

热心网友

<a>标签背景颜色我是通过变换class来实现的，分别在css里面加入了灰色和蓝色背景的class

html代码如下：

<ul class="ttm" id="ttm">
<li class="ttm" id="ttm">
<a  class="ttm1" id="ttm1" onclick="clickttm(this)">1</a>
<a  class="ttm2" id="ttm2" onclick="clickttm(this)">2</a>
<a  class="ttm2" id="ttm3" onclick="clickttm(this)">3</a>
<a  class="ttm2" id="ttm4" onclick="clickttm(this)">4</a>
<a  class="ttm2" id="ttm5" onclick="clickttm(this)">5</a>
</li>
</ul>

CSS代码如下：

body{
background:#eee;
}
ul .ttm {
list-style:none;
}

a {
color:white;
cursor:hand;
}

.ttm1 {
background:blue;
}

.ttm2 {
background:gray;
}

JS代码如下：

function clickttm(ele) {
getElementsByClassName("ttm1")[0].className = "ttm2";
ele.className = "ttm1";
}

function getElementsByClassName(searchClass,node,tag) {
if(document.getElementsByClassName){
return  document.getElementsByClassName(searchClass)
}else{    
node = node || document;
tag = tag || '*';
var returnElements = []
        var els =  (tag === "*" && node.all)? node.all : node.getElementsByTagName(tag);
var i = els.length;
searchClass = searchClass.replace(/\-/g, "\\-");
var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
while(--i >= 0){
if (pattern.test(els[i].className) ) {
returnElements.push(els[i]);
}
}
return returnElements;
    }
}

希望能帮你解决问题