SLINA_love
2016-05-19 19:25
//定义getByClassName函数,让函数实现根据class name获取对象并返回
function getByClassName(obj,cls){
var elements = obj.getElementsByTagName('*');
var result=[];
for(var i=0;i<elements.length;i++){
if(elements[i].className == cls){
result.push(elements[i]);
}
}
return result;
}
function hasClass( obj, cls ){
return obj.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
}
function removeClass( obj, cls ){
if( hasClass( obj, cls )){
//remove
var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
obj.className = obj.className.replace(reg, "");
}
}
//定义getByClassName函数,让函数实现给对象增加class
function addClassName( obj, cls ){
if(!hasClass(obj,cls)){
obj.className += " "+cls;
}
}
window.onload = function(){
window.onscroll = function(){
var top = document.documentElement.scrollTop || document.body.scrollTop;
var menus = document.getElementById("menu").getElementsByTagName("a");
var items = getByClassName(document.getElementById("content"), "item");
var currentId = "";
for ( var i=0; i< items.length; i++ ){
var _item = items[i];
var _itemTop = _item.offsetTop;
if( top > _itemTop - 200 ){
currentId = _item.id;
} else {
break;
}
}
//请补充此处代码,给正确的menu下的a元素class赋值current
if(currentId){
var _Link=getByClassName(document.getElementById("menu"),"current");
var _href=_Link.getAttribute("href");
var _menu=document.getElementById("menu");
if(_href!="#"+currentId){
removeClass(_menu,"current");
//_menu.className("");
}else{
addClassName(_menu,"current");
// _menu.className("current");
}
}
}
}
if(currentId){
var _Link=getByClassName(document.getElementById("menu"),"current");
var _href=_Link.getAttribute("href");
var _menu=document.getElementById("menu");
if(_href!="#"+currentId){
removeClass(_menu,"current");
//_menu.className("");
}else{
addClassName(_menu,"current");
// _menu.className("current");
}
}
这代码好几个漏洞,首先没有循环遍历导航menu中的a元素,你运行的时候只能执行一次添加/删除 current,然而你目前的代码连执行一次的能力都没有,因为这里
var _Link=getByClassName(document.getElementById("menu"),"current");
var _href=_Link.getAttribute("href");
这里的_Link 是一个数组,虽然只有一个成员,var _href=_Link.getAttribute("href");应该写成
var _href=_Link[0].getAttribute("href");
但是即使你这里对了,后面也没法加循环去实现导航滚动的时候随时添加/删除current, 因为你这里写死了。
还是按照老师的来吧。。。
最后那个地方你的for循环呢,需要循环判断
网页定位导航特效
71404 学习 · 486 问题
相似问题