网页定位导航特效_技术问答

慕村8974351

cls代表什么: class; 2018-01-03 2回答·1808浏览

AllenPeng

safari兼容问题: .。。。。。。; 2017-11-29 1回答·2649浏览

慕仙5237505

哪位大神来解救我呀！找了一上午的bug没找到怀疑是不是不兼容啊，我的js jq做得焦点全部没有反应啊，左边滚动的时候，右边焦点没有定焦，也么有背景颜色，帮我看看错哪里辣？一个个都是没颜色,

改为这个

#menu ul li a.current

2017-11-17 3回答·1381浏览

慕仙5237505

关于构建函数添加，移除，是否有等返回值的问题及变量申明不用_下划线的区别问题，求大神详解

这里的hasClass是用来判断元素是否有某个class的，只需要读取需要的值即可。而后面两个方法是用来操作（增加、删除）class的，是需要操作DOM，需要改变值的，所以会有赋值操作。
变量的命名没有特别的讲究，可以有自己的风格。通常变量名前面加下划线，表示这个变量是这个方法中的私有变量。

2017-11-17 1回答·1405浏览

小白亭

滚动没有效果，而且也没有显示错误，麻烦大神帮帮忙指出（已解决）: 问题已解决。; 2017-08-08 2回答·1074浏览

慕用9244143

不知道哪错了

<script>
 
//根据类名获取元素
function getByClassName(obj,cls){
    var ele=obj.getElementsByTagName('*');
    var result=[];
    for (var i=0;i<ele.length;i++){
        if (ele[i].className==cls)
        {
            result.push(ele[i]);
             
        }
        // return result;
    }
    return result;
 
}
 
 
 
window.onload=function(){
    var mem=document.getElementsByClassName('mem');
    for (var i=0;i<mem.length;i++)
    {
    mem[i].onmouseover=function(){
        this.style.border='2px solid #999';
    }
    mem[i].onmouseout=function(){
        this.style.border='1px solid #c2c2c2';
    }
    }
     
    var img=document.getElementsByTagName('img');
    for (var i=0;i<img.length;i++)
    {
        img[i].onmouseover=function(){
        this.style.opacity='0.8';
    }
    img[i].onmouseout=function(){
        this.style.opacity='1';
    }
    }
     
     
    function hasClass(obj,cls)
    {
        // return obj.ClassName.match(new RegExp("(\\s|^"+cls+"(\\s|$)"));
        return obj.className.match(new RegExp("(\\s|^)"+cls+"(\\s|$)"));
    }




    function removeClass(obj,cls)
    {
        // if (hasClass(obj.cls))
        if(hasClass(obj,cls))
        {
           // var reg=new RegExp("(\\s|^"+cls+"(\\s|$)");
           var reg=new RegExp("(\\s|^)"+cls+"(\\s|$)");
            // obj.ClassName=obj.replace(reg,"");
            obj.className=obj.className.replace(obj.className.match(reg)[0],"");
        }
    };
     
    function addClass(obj,cls)
    {
        if (!hasClass(obj,cls))
        {
           // obj.ClassName+= " "+cls;
           obj.className+= " "+cls;
        }
         
         
    }
     
     
     
     
    window.onscroll=function(){
        var top=document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop;
        var menus=document.getElementById('menu').getElementsByTagName('a');
        var pics=getByClassName(document.getElementById('pic'),'mem');
        var currentId="";
        for (var i=0;i<pics.length;i++)
        {
            var pic=pics[i];
            var picTop=pic.offsetTop;
            if (top>picTop-200)
            {
            	// currentId=pic.id;
                currentId="#"+pic.getAttribute("id");
            }
            else 
            {
               // break;             
               return ;
            }
            if (currentId)
            {
                for (var j=0;j<menus.length;j++)
                {
                    var menu=menus[j];
                    // var hre=menu.href.split('#');
                    var hre=menu.getAttribute("href");
                    // if (hre[hre.length-1]!=currentId)
                    if(hre!=currentId)
                    {
                        // menu.removeClass(menu,"first");
                        removeClass(menu,"first");
                    }
                    else {// menu.addClass(menu,"first");
                    	addClass(menu,"first");
                	}
                 
                 
                }
                 
            }
             
        }
         
         
    }
         
}
</script>

2017-05-07 1回答·1156浏览

百兽凯多00

正则表达式: 如果\s要加转义符那|也应该加啊; 2017-03-10 3回答·1068浏览

慕粉18221508921

var top 法一法二不应该等价的么，为什么法二运行不了？: 已采纳慕九州3621434 的回答; 可能是法二的top没有定义：var　top;; 2017-02-20 1回答·1167浏览

野生前端菜鸟

为什么原生js滚动切换没效果，大神来看一看: 已采纳传说中的小白龙的回答; 你能把html代码也贴出来吗。。这很难看出问题啊。。; 2017-01-24 2回答·1095浏览

慕粉3988711

来个高人给我们noob解读下: 2016-11-30 2回答·765浏览

慕仙4324424

哪位大神帮我找找错，滑动滚轮楼层不跳转

removeClass函数里的obj.className=obj.className.replace(req,"");

改成obj.className=obj.className.replace(reg,"");

if(currentId){

for(var j=0;j<menus.length;j++){

var _menu=menus[i];

中的var _menu=menus[i];

改成

var _menu=menus[j];

虽然晚了几年

2016-11-24 4回答·972浏览

幕布斯7328391

用obj.className直接设置链接中的className有什么弊端吗: 在这个编码环境下是没有，如果有多个className，添加class, 要这样， links[j].className +=" "+ "link active"; 还有添加移除前都要判断是否已经存在 "link active"; 2016-11-16 1回答·1284浏览

LanceChou

有什么问题？

已采纳霓裳梦竹Andy 的回答

1,getByClassName 里面的 var elements=document.getElementsByTagName('*');应该为var elements=obj.getElementsByTagName('*');

2,var top=document.documentElement?document.documentElement.scrollTop:document.body.scrollTop;改成var top=document.documentElement.scrollTop||document.body.scrollTop;

2016-11-15 1回答·917浏览

慕粉3197089

原生js实现

function getByClassName(obj,cls){

var elements=document.getElementsByTagName("*"); //把父元素下面所有的元素都获取到

var result=[];//返回的结果就是所有class=cla的数组

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|$)"));//判断className里面是否包含我们传入的cls值

}

function removeClass(obj,cls){

if(hasClass(obj,cls)){

//remove

var reg=new RegExp("(\\s|^)"+cls+"(\\s|$)");

obj.className=obj.className.replace(reg,"");//把包含这个class的字符串替换成空

}

function addClass(obj,cls){

if(!hasClass(obj,cls)){

obj.className+=" "+cls;

}

//页面载入之后

window.onload=function(){

//监听滚动条事件

window.onscroll=function(){

//获取滚动条top值。

var top=document.documentElement.scrollTop||document.body.scrollTop;

var menus=document.getElementById("menu").getElementsByTagName("a");

var items=getByClassName(document.getElementById("content"),"item");

var currentId="";//获取当前滚动条所在楼层的Id

for(var i=0;i<items.length;i++){

var _item=items[i];

var _itemTop=_item.offsetTop;

console.log(_item.offsetTop);

if(top>_itemTop-200){

currentId=_item.id;

}else{

break;//跳出for循环

}

if(currentId){

//给正确的menu下的a元素class赋值。

for(var j=0;j<menus.length;j++){

var _menu=menus[j];//获取当前的menu

var _href=_menu.href.split("#");

if(_href[_href.length-1]!=currentId){

removeClass(_menu,"current");

}else{

addClass(_menu,"current");

}

2016-09-23 2回答·901浏览

慕桂英9545975

正则表达式: 已采纳第二热情的回答; 这要匹配的元素可能有不止一个类<div id="item5" class="item" "item1">明白了么，这是全面的考虑就算有空格也要能判断到; 2016-09-08 1回答·894浏览

何烨坪

js代码问题

已采纳脑阔疼的回答

查一下有没有用到没有定义的方法浏览器里F12看一下控制台报错

2016-08-16 1回答·673浏览

追觅梦初的国度

为什么不用classList呢？: 那是html5中才有的; 2016-07-31 2回答·776浏览

苍白的尾巴

调试说obj.getElementsByTagName is not a function，怎么解决？

已采纳 ParkerYoung 的回答

好多错误啊！

var items = getByClassName("document.getElementById('content')",'item');

第一这里用了双引号括住导致变了字符串，所有getByClassName函数解释不到对象OBJ所以报错，

var _itemTop = _item.offSet;

这里获取了item的偏移值，但没获取偏移的高应该.offsetTop

        if(currentId){
            for (var j = 0; j < menus.length; j++) {
                var _menu = menus[i];
                var _href = _menu.href.split('#');
                if(_href[_href.length-1] !=  currentId){
                    removeClass('_menu','current');
                }else{
                    addClass('_menu','current');
                }
            }
        }

这一段两处错误，变量值为j,你却引用了i,导致循环都没用的情况_menu获取不到对象,应该menu[j];

removeClass和addClass函数都用obj参数都用了单引号写成字符串也是没对象

2016-07-22 1回答·4432浏览

飞天意大利面神兽

哪里有问题？http://www.imooc.com/video/901: 改为 var top=document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop;; 2016-07-14 3回答·866浏览

请叫我橙子蛋

为什么不对？检查半天没找到哪里有问题

哦，还有一个我最先改的，忘了说，

var top=document.documentElement?document.documentElement.scrollTop:document.body.scrollTop;

改成var top=document.documentElement。scrollTop?document.documentElement.scrollTop:document.body.scrollTop;

你再试下。。。

2016-04-22 4回答·1235浏览

STRONG很壮不怕撞

谷歌浏览器取不到scrollTop值: 因为写错啦，正确的应该是var top = document.documentElement.scrollTop || document.body.scrollTop;; 2016-04-13 1回答·1373浏览

marshall_stan

我的JS代码，，发现很多同学都说JS不出来效果，刚开始我也是，，但是后来发现真的是书写上的小问题啊！大家还是仔细检查下自己的代码吧！: 2015-09-02 4回答·1023浏览

小茗童鞋

Dreamweaver不是可以用结构来制作吗

已采纳 Perona 的回答

table布局的年代可视化编程确实挺好用，不过现在似乎敲代码都比拖拉控件快的多。因为有emmet插件~~~

喜欢可视化编程可以看下Unity开发，这可视化编程做得相当牛逼~~~

2015-08-06 2回答·796浏览

梦身

JS没有addclass等，直接用classname赋值不行吗？: className js对大小写敏感; 2015-07-22 6回答·4225浏览

celceta

\\s是什么意思？

转义字符吧 \\代表一个反斜线字符''\'

2015-07-06 1回答·1426浏览

程序爱好者11

这教程完全不适合新手啊: 对啊讲到的什么都不带解释一下的，Tomcat是什么一脸懵逼; 2015-06-25 2回答·1151浏览

qq_星空下的幻想_0

老师为什么JS原生代码里面ADDclass要添加类要带空格，求解答

已采纳小小程序员一枚的回答

举例子：

上面是一个div，这个div的样式已经有两个，所以你再添加class的时候就需要加空格后再加入新的样式。

最后得到：

2015-06-22 4回答·2790浏览

谭谭谭

正则表达式: http://www.cnblogs.com/light169/archive/2006/10/18/532347.html; 2015-05-15 2回答·1351浏览

shandy谜

为什么原生没有效果呢，是我写的有问题吗？？？求教~~~: 不好意思，已经找到错误的~~; 2015-05-15 2回答·1099浏览

回夢

为啥不直接用_menu.class("");来进行赋值就行了赋值为空 class就没了，赋值为current class不就改变了吗？: 已采纳用户已禁用的回答; 一个元素可以有很多不同的class，如果你直接使class为空，就相当于删除了元素所有的class，这样的话对于css和jQuery等需要用到class选择器的代码来说是很不利的。; 2015-04-02 2回答·1212浏览