HTML javascript getattribute无法正常工作

Question

I'm stuck on this for a while now and i don't know whats wrong. 我现在坚持了一段时间，我不知道怎么了。 My getAttribute is always returning undefined.. I've tried a lot ,i messed with value and classnames but it always returns undefined. 我的getAttribute总是返回undefined。。我已经尝试了很多，我弄乱了值和类名，但是它总是返回undefined。 please help someone 请帮助某人

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="resources/css/Home.css" rel="stylesheet"/>
</head>
<body>

<div id="floatleft">
    <img class="ploegen.html"  onclick="GoTo(this)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/ploegenhome.jpg">
    <img onclick="GoTo(x)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/stadionhome.jpg">
    <img  onclick="GoTo(x)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/opstellinghome.png">
    <img  onclick="GoTo(x)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/simulatiehome.jpg">
</div>
<img src="resources/logo_wk_2018.png" id="logowk">
<div id="tekstjes">
    <ul>
        <li><a>Ploegen</a></li>
        <li><a>Stadions</a></li>
        <li><a>Opstelling</a></li>
        <li><a>Simulatie</a></li>
    <ul/>
</div>
<p id="lol"></p>
<script>
    function GoTo(x){
       var y = x.getAttribute(className);
        document.getElementById("lol").innerText = y;

    }
    function leave(x){
        x.style.opacity = 0.5;
    }
    function hover(x){

        x.style.opacity = 1;
        var y = x.getAttribute(className);
        document.getElementById("lol").innerText = y;
    }
</script>

</body>
</html>

Answer 1

Error : 错误：

The problem with your code is that there is no variable called ClassName in your code. 您的代码的问题是您的代码中没有名为ClassName变量。
Another thing that was wrong was that you were using x in your onClick function for goTo instead of this 另一错误的地方是您在goTo的onClick函数中使用了x ，而不是this
Another slight problem that I found when running the code was that in the end of your <ul> tag you used <ul/> instead of </ul> to close the tag. 我在运行代码时发现的另一个小问题是，在<ul>标记的末尾使用<ul/>而不是</ul>来关闭标记。

Fix : 解决：

 function GoTo(x){ var y = x.getAttribute("class"); document.getElementById("lol").innerText = y; } function leave(x){ x.style.opacity = 0.5; } function hover(x){ x.style.opacity = 1; var y = x.getAttribute('class'); document.getElementById("lol").innerText = y; }

 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link href="resources/css/Home.css" rel="stylesheet"/> </head> <body> <div id="floatleft"> <img class="ploegen.html" onclick="GoTo(this)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/ploegenhome.jpg"> <img onclick="GoTo(this)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/stadionhome.jpg"> <img onclick="GoTo(this)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/opstellinghome.png"> <img onclick="GoTo(this)" onmouseleave="leave(this)" onmouseover="hover(this)" src="resources/simulatiehome.jpg"> </div> <img src="resources/logo_wk_2018.png" id="logowk"> <div id="tekstjes"> <ul> <li><a>Ploegen</a></li> <li><a>Stadions</a></li> <li><a>Opstelling</a></li> <li><a>Simulatie</a></li> </ul> </div> <p id="lol"></p> </body> </html>

Thanks to @RogerC for who spotted a mistake in the code that I thought I had fixed :) 感谢@RogerC谁发现了我认为自己已解决的代码错误:)

HTML javascript getattribute无法正常工作

问题描述

1 个解决方案

解决方案1
4 已采纳 2018-05-16 13:29:39

Error : 错误：

Fix : 解决：

HTML javascript getattribute无法正常工作

问题描述

1 个解决方案

解决方案1 4 已采纳 2018-05-16 13:29:39

Error : 错误：

Fix : 解决：

解决方案1
4 已采纳 2018-05-16 13:29:39