ソースコード表示ページ（「今日の出来事」表示）

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>今日の出来事 - Wikipediaより</title>
</head>
<body>
    <h1 id="dynamic-title">今日の出来事</h1>
    <ul id="events-list">
        <li>読み込み中...</li>
    </ul>

    <p id="source-info" style="margin-top: 20px; font-size: 0.9em; color: #666;"></p>

    <script>
        // 日付情報の取得とタイトル設定
        const today = new Date();
        const month = today.getMonth() + 1;
        const day = today.getDate();
        const pageTitle = `${month}月${day}日`;

        document.getElementById('dynamic-title').textContent = `${pageTitle}の出来事`;

        /**
         * Wikipedia APIから指定した日付のページ内容を取得
         */
        function fetchWikipediaEvents() {
            const apiUrl = `https://ja.wikipedia.org/w/api.php?` +
                `action=parse&` +
                `page=${encodeURIComponent(pageTitle)}&` +
                `format=json&` +
                `origin=*`;

            fetch(apiUrl)
                .then(response => {
                    if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
                    return response.json();
                })
                .then(data => handleData(data))
                .catch(error => {
                    console.error('Fetch error:', error);
                    document.getElementById('events-list').innerHTML = '<li>データの取得に失敗しました。</li>';
                });
        }

        /**
         * 取得したHTMLから「できごと」セクションを抽出して表示
         */
        function handleData(data) {
            const htmlContent = data.parse?.text?.['*'];
            if (!htmlContent) {
                document.getElementById('events-list').innerHTML = '<li>コンテンツが見つかりませんでした。</li>';
                return;
            }

            // 文字列HTMLをDOMオブジェクトに変換して解析
            const parser = new DOMParser();
            const doc = parser.parseFromString(htmlContent, 'text/html');
            const listElement = document.getElementById('events-list');
            
            // 「できごと」見出し(id="できごと")直後の <ul> 要素を特定
            const eventsHeading = doc.getElementById('できごと');
            let eventsUl = null;

            if (eventsHeading) {
                // 見出しの親要素（通常 .mw-parser-output）から兄弟要素を走査
                let nextElement = eventsHeading.parentElement.nextElementSibling;
                while (nextElement) {
                    if (nextElement.tagName === 'UL') {
                        eventsUl = nextElement;
                        break;
                    }
                    // 次のh2セクションに到達した場合は終了
                    if (nextElement.tagName === 'H2') break;
                    nextElement = nextElement.nextElementSibling;
                }
            }

            listElement.innerHTML = ''; 

            if (eventsUl) {
                // 不要な注釈（[1]など）を除去
                eventsUl.querySelectorAll('sup, .reference, .noprint').forEach(ref => ref.remove());

                // 各リスト項目のリンクをWikipedia本家へ飛ばすよう調整
                Array.from(eventsUl.children).forEach(item => {
                    item.querySelectorAll('a[href^="/wiki/"]').forEach(link => {
                        const href = link.getAttribute('href');
                        link.setAttribute('href', `https://ja.wikipedia.org${href}`);
                        link.setAttribute('target', '_blank');
                        link.setAttribute('rel', 'noopener noreferrer');
                    });
                    listElement.appendChild(item);
                });

                // 出典情報の表示
                const sourceInfo = document.getElementById('source-info');
                sourceInfo.innerHTML = `出典: <a href="https://ja.wikipedia.org/wiki/${encodeURI(pageTitle)}" target="_blank" rel="noopener noreferrer">Wikipedia「${pageTitle}」</a>`;
            } else {
                // モバイル端末判定
                const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
                let message = '<li>「できごと」セクションが見つかりませんでした。</li>';
                
                if (isMobile) {
                    message += '<li>スマートフォンの場合は、ブラウザの設定から「PC版サイト」に切り替えてお試しください。</li>';
                }
                
                listElement.innerHTML = message;
            }
        }

        // 実行
        fetchWikipediaEvents();
    </script>
</body>
</html>
Wikipedia APIを使って「今日の出来事」を表示
