手から出たゴミ

食って、寝て、糞をする合間で作り出されたゴミ

javascriptでtypeの操作

やったこと

入力画面にて、パスワードを2回入力を実装しようとしていたところ

離脱率が高くなるので、ボタンでパスワードの表示、非表示を切り替えた方がよいと知り

inputのtype操作を行った

コード

<!DOCTYPE html>
<html lang="ja">
<title></title>

<head>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript">
        function show_id() {
            var show = document.getElementById("password");
            if (show.type == "password") {
                show.setAttribute("type", "text");
            }
            else {
                show.setAttribute("type", "password");
            }
        };
    </script>
</head>

<body>
    <li>
        <label for="password">パスワード</label>
        <input type="password" name="password" id="password">
        <a href="#" id="show_id" onclick="show_id()">Show_id</a>
    </li>
</body>

</html>

終わりに

ByClassNameで要素を取得しようとしたところ詰まってしまい、teratailで質問した

結局、idを利用したがclassを使用する時には気をつけたい

JQuaryを使ったら簡単にできるんだけど、勉強のためだと自分に言い聞かせてる。Mなのか?