<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hidden Words Example</title>
    <style>
        /* CSSで隠されている要素 */
        .hidden-by-css {
            display: none;
        }
    </style>
</head>
<body>

    <!-- CSSで隠されている例 -->
    <button class="hidden-by-css">kstm{******}（CSS）</button>

    <!-- HTML属性で隠されている例 -->
    <button class="hidden-by-attribute" data-hidden-text="kstm{******}（属性）">
        ボタンをクリックしても何も起こらない
    </button>

    <!-- JavaScriptで隠されている例 -->
    <button class="hidden-by-js">kstm{******}（JavaScript）</button>

    <script>
        // JavaScriptで隠す
        document.querySelector('.hidden-by-js').style.visibility = 'hidden';
    </script>
</body>
</html>
