【问题标题】:What is the javascript equivalent of the following? [closed]以下内容的 javascript 等价物是什么? [关闭]
【发布时间】:2013-01-07 22:54:11
【问题描述】:

如何使用 vanilla javascript 实现这一点?以下使用jQuery语法。

$(function(){
    $("ul.dropdown li").hover(
        function(){
            $(this).addClass("hover"); 
            $('ul:first',this).css('visibility', 'visible');
        },
        function(){
            $(this).removeClass("hover");
            $('ul:first',this).css('visibility', 'hidden');
        }
    );
    $("ul.dropdown li ul li:has(ul)").find("a:first").append(" » "); 
});

【问题讨论】:

  • jQuery 也是 JavaScript。
  • 来吧,至少尝试以一种人们愿意帮助你的方式提问......
  • 请使用将来可用的格式化工具编辑您的帖子并正确换行和缩进您的代码。那个代码是不可读的。查看 Cerbrus 所做的编辑修订,以了解他们做了什么。 =)
  • @J.Steen:“他做到了”,我只是一个人:P [/nitpicking]
  • @Cerbrus 没有考虑到您使用的名字类似于三头狗的名字这一事实;)我 - 和许多其他人 - 当我们不知道时使用“他们”一个人的性别。 =)

标签: javascript jquery jquery-ui


【解决方案1】:

类似这样的东西:

document.body.addEventListener(
    'load',
    function(){
        var elements = document.querySelectorAll("ul.dropdown li");
        for(var i = 0, l = elements.length; i < l; i++){
            var e = elements[i];
            e.addEventListener('mouseover', function(e){
                e.setAttribute('class', e.getAttribute('class') + ' hover');
                document.querySelector("ul.dropdown li").style.visibility = 'visible';
                e.style.visibility = 'visible';
            })
            e.addEventListener('mouseout',  function(e){
                e.setAttribute('class', e.getAttribute('class').replace(' hover',''));
                document.querySelector("ul.dropdown li").style.visibility = 'hidden';
                e.style.visibility = 'hidden';
            })
        }
        document.querySelector("ul.dropdown li ul li:has(ul)").querySelector("a:first").innerHTML += " &raquo; "; 
    }
)

(但不一样)

【讨论】:

  • 嘿,这让我的生活轻松多了。谢谢:)
  • 其实我只需要理解jQuery语法难以理解的概念。所以这确实很有帮助。
  • 哦,所以基本上,这是一个“这是做什么的?”问题?
猜你喜欢
  • 2016-07-04
  • 1970-01-01
  • 2013-12-16
  • 2012-09-12
  • 2010-11-16
  • 2012-09-06
  • 2014-02-24
  • 1970-01-01
  • 2013-04-07
相关资源
最近更新 更多