Question

我正在尝试制作一个JS，但由于我不是那方面的专家，也许有人可以帮助我。我在谷歌和Stack Overflow中搜索它，但没找到我需要的东西。我刚刚发现onmouseover改变了元素本身的类。但我想要一些不同的东西：

我想在onmouseover代码上设置a，将其他元素中的closed类更改为open。例如：

<a href="#" onmouseover="<active event>">Link</a>

<ul class="dropdown closed"><li>Item</li></ul>

此致

Answer 1

您可以使用<a href="#" onmouseover="changeClass">Link</a>

和JS：

function changeClass() {
    document.getElementById("other-element").className = "open";
}

更高级的JSFiddle：http://jsfiddle.net/eRdHJ/1/

Answer 2

如果你包含jQuery：

为您的元素添加ID：

<a href="#" id="a1">Link</a>
<ul class="dropdown closed" id="ul1"><li>Item</li></ul>

使用Javascript：

$("#a1").mouseover(function(){
  $("#ul1").addClass("open").removeClass("closed")
})

Answer 3

<a href="#" onmouseover=$("ul.dropdown").addClass("open").removeClass("closed")>Link</a>

<ul class="dropdown closed"><li>Item</li></ul>

这是jsfiddle：http://jsfiddle.net/eRdHJ/2/

Answer 4

这将访问页面上的第一个<ul>。要缩小范围，首先需要getElementById来获取基于标记名称的元素。然后，它将仅使用该特定ID名称从该标记中选择子项;

<script>
    function changeUl() {
        // Get the first found UL, anywhere in the body
        document.getElementsByTagName('ul')[0].className = 'otherName';
    }
</script>

<a href="#" onmouseover="changeUl();">Link</a>

ID

<script>
    function changeUl() {
        var wrapper = document.getElementById('wrapper');
        wrapper.getElementsByTagName('ul')[0].className = 'otherName';
    }
</script>

<div id="wrapper">
    <a href="#" onmouseover="changeUl();">Link</a>
</div>

你可能想检查是否有任何发现。如果找不到[0]，<ul>可能会触发未定义/错误。

Onmouseover从其他元素更改CSS类

4 个答案: