次のようなコードで、上記の要望に応えるアプリを作成できます。

```html
<!DOCTYPE html>
<html>

<head>
    <title>URL文字数カウンター</title>
</head>

<body>
    <script>
        function countCharacters() {
            var url = prompt("カウントするURLを入力してください: ");
            var isTopPage = prompt("カウントする対象はトップページのみです。続行するには[Y/N]を入力してください: ");

            if (isTopPage.toUpperCase() !== "Y") {
                console.log("カウント対象がトップページではありません。");
                return;
            }

            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        var count = xhr.responseText.length;
                        console.log("文字数: " + count);
                    } else {
                        console.log("URLの取得に失敗しました。");
                    }
                }
            };
            xhr.open("GET", url, true);
            xhr.send();
        }

        countCharacters();
    </script>
</body>

</html>
```

このプログラムでは、まずユーザーにURLを入力してもらい、次にトップページのみをカウントすることを確認します。条件を満たしていない場合は、カウントを中止します。

その後、XMLHttpRequestを使用して指定されたURLのトップページの内容を取得し、その内容の文字数を計算して表示します。

なお、このコードではカウント結果を`console.log()`で表示していますが、必要に応じてHTML要素に表示するように変更することもできます。

ジョークを取り入れる場合は、以下のようなメッセージを表示できます。

```javascript
console.log("URLの文字数をカウントします。\nちなみに、ウェブページは「有坂美香」に対して「押忍」とおっしゃっています。");
```