ボタンの色が変わらないのはなぜですか？（html要素のクラスを変更する方法）

私はブートストラップやものでWebサイトを作ろうとしています。要素のクラスを変更したいと思います。私のコードが動作していないのを見たので、私はどこが間違っているかを見てみました。私はdjangoで簡単に解決できると知っていますが、私のコードがうまくいかない理由を知りたいのです。ボタンの色が変わらないのはなぜですか？（html要素のクラスを変更する方法）

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title></title> 
    <style type="text/css"> 
    .blue{ 
     background-color: blue 
    } 
    .green{ 
     background-color: green 
    } 
    </style> 
</head> 
<body> 
    <button type ="button" id="btn1" class = "blue" onclick="clicked()">hello</button> 
    <script> 
     function clicked(){ 
      document.getElementByid("btn1").className = "green" 
     } 
    </script> 
</body> 
</html>

ボタンをクリックした後、ボタンは青色のままです。ご協力いただきありがとうございます。

出典

2016-07-12 bar azaria

は、お使いのコンソール（Windows上でヒットF12、Mac上のOpt + Cmdを+ I）を確認してください。あなたはタイプミスがあります。 'getElementByid'は' getElementById'でなければなりません。 –

コードに構文エラー（またはタイプミス）がありました。有効な機能が大文字のI、すなわちdocument.getElementByIdを持っていて、document.getElementByidを小文字のiで使用していました。

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <title></title> 
 
    <style type="text/css"> 
 
    .blue{ 
 
     background-color: blue 
 
    } 
 
    .green{ 
 
     background-color: green 
 
    } 
 
    </style> 
 
</head> 
 
<body> 
 
    <button type ="button" id="btn1" class = "blue" onclick="clicked()">hello</button> 
 
    <script> 
 
     function clicked(){ 
 
      document.getElementById("btn1").className = "green" 
 
     } 
 
    </script> 
 
</body> 
 
</html>

出典

2016-07-12 16:49:56

タイプミスの回答については、 – brk

@ user2181397をご利用ください。申し訳ありませんが、コードスニペットにコードをコピーして、他のいくつかの問題が予想されていました。 –

@MohitBhardwajは大変ありがとう！そんなばかげてすみません。 –

ボタンの色が変わらないのはなぜですか？ （html要素のクラスを変更する方法）

答えて

関連する問題

ボタンの色が変わらないのはなぜですか？（html要素のクラスを変更する方法）