HTML JAVAScript コンテンツをランダムでどっちかだけ出す(A/B) 

<!DOCTYPE html>
<html>
<head>
    <title>ページのタイトル</title>
</head>
<body>
    <!-- ページのコンテンツ -->

    <div id="contentA">コンテンツA</div>
    <div id="contentB">コンテンツB</div>

    <script>
        document.addEventListener("DOMContentLoaded", function() {
            var contentA = document.getElementById('contentA');
            var contentB = document.getElementById('contentB');

            var random = Math.floor(Math.random() * 2);

            if (random === 0) {
                contentA.style.display = 'block';
                contentB.style.display = 'none';
            } else {
                contentA.style.display = 'none';
                contentB.style.display = 'block';
            }
        });
    </script>
</body>
</html>

window.onload より
window.addEventListener("DOMContentLoaded", function() { ... }) を使用する方が良い場合があります。
window.onload と比較して、いくつかの利点があります。

速度: DOMContentLoaded イベントは、HTML が完全に読み込まれて解析された時点で発生しますが、スタイルシート、画像、サブフレームの読み込みは待ちません。一方、window.onload はページ上の全てのリソース（画像、スタイルシート、スクリプトなど）の読み込みが完了した後に発火します。そのため、DOMContentLoaded を使用した方がページがより早くインタラクティブになります。

柔軟性: 複数の DOMContentLoaded リスナーをページに追加できますが、window.onload を複数設定すると、前の設定を上書きしてしまう可能性があります。