查看“︁用户:RedDragon/Test”︁的源代码

<html>

    <div style="margin: 5%">
        <div style="margin-top: 100px; display: flex; justify-content: center; align-items: center">
            <input type="text" id="alias-input" style="padding: 8px; background: #ffffff; font-size: 16px; width: 15rem; border-radius:  5px 0 0 5px" placeholder="输入曲目名称或别名...">
            <button id="alias-btn" style="padding: 8px 18px; background: #3366CC; color: #ffffff; font-size: 16px; border: none; border-radius: 0 5px 5px 0">搜索</button>
        </div>
        <div style="margin-top: 100px">
            <h3>搜索结果：</h3>
            <div id="alias-results" style="color: #333">
                <div class="no-results"></div>
            </div>
        </div>
        <div style="margin-top: 100px">
            <h3>别名列表：</h3>
            <ul id="all-alias" style="color: #333"></ul>
        </div>
    </div>

<script>
    document.addEventListener('DOMContentLoaded', function () {
        initAllAliases()

        document.getElementById('alias-btn').addEventListener('click', searchSongs)
        document.getElementById('alias-input').addEventListener('keypress', function (e) {
            if (e.key == 'Enter') searchSongs()
        })
    })

    function initAllAliases() {
        const container = document.getElementById('all-alias')
        container.innerHTML = ''

        songlist.forEach(function (song) {
            const li = document.createElement('li')
            li.innerHTML = `<span class="song-title">${song.title}</span>: <span class="aliases">${song.aliases.join('、')}</span>`
            container.appendChild(li)
        })
    }

    function searchSongs() {
        const searchText = document.getElementById('alias-input').value.trim().toLowerCase()
        const resultsContainer = document.getElementById('alias-results')

        if (!searchText) {
            resultsContainer.innerHTML = '<div class="no-results">输入关键词进行搜索</div>'
            return
        }

        // 计算匹配度并排序
        const results = songlist.map(function (song) {
            // 检查标题匹配
            const titleMatch = song.title.toLowerCase().includes(searchText)
            // 检查别名匹配
            const aliasMatches = song.aliases.filter(function (alias) {
                return alias.toLowerCase().includes(searchText)
            })
            // 计算权重
            let score = 0
            if (titleMatch) score += 5  // 标题权重
            score += aliasMatches.length * 2  // 别名权重
            return {
                song: song,
                score: score
            }
        }).filter(function (result) {
            return result.score > 0  // 过滤掉不匹配的
        }).sort(function (a, b) {
            return b.score - a.score  // 按匹配度降序排序
        })

        if (results.length == 0) {
            resultsContainer.innerHTML = '<div class="no-results">没有找到匹配的曲目</div>'
        } else {
            resultsContainer.innerHTML = ''
            results.forEach(function (result) {
                const div = document.createElement('div')
                div.className = 'result-item'
                div.style.margin = "0 0 0.5rem 1rem"
                div.style.lineHeight = "1.5"
                div.innerHTML = `
                    <div class="song-title">${result.song.title}</div>
                    <div class="aliases" style="font-size: 13px; margin-left: 1rem">alias: ${result.song.aliases.join('、')}</div>
                `
                resultsContainer.appendChild(div)
            })
        }
    }

    const songlist = [
        {
            title: "Pastel Lines",
            aliases: []
        },
        {
            title: "Gleam feat. ふわまろ",
            aliases: []
        },
        {
            title: "Power Attack",
            aliases: []
        },
        {
            title: "Skyscape",
            aliases: []
        },
        {
            title: "On And On!!",
            aliases: []
        },
        {
            title: "Polygons",
            aliases: []
        },
        {
            title: "Abgrund",
            aliases: []
        },
        {
            title: "Journey To The Rainbows",
            aliases: []
        },
        {
            title: "Midnight Flux",
            aliases: []
        },
        {
            title: "NO ONE YES MAN",
            aliases: []
        },
        {
            title: "Clock Paradox",
            aliases: []
        },
        {
            title: "F℟IEND",
            aliases: []
        },
        {
            title: "Shattered",
            aliases: []
        },
        {
            title: "Swing Sweet Twee Dance feat. ななきなな",
            aliases: []
        },
        {
            title: "V!rtuaresort",
            aliases: []
        },
        {
            title: "Dice 20",
            aliases: []
        },
        {
            title: "macro.wav",
            aliases: []
        },
        {
            title: "The Next Arcady",
            aliases: []
        },
        {
            title: "Sakura Fubuki",
            aliases: []
        },
        {
            title: "Tempest",
            aliases: []
        },
        {
            title: "Authentic (Game ver.)",
            aliases: []
        },
        {
            title: "MilK",
            aliases: []
        },
        {
            title: "ILLEGAL LEGACY",
            aliases: []
        },
        {
            title: "竹",
            aliases: []
        },
        {
            title: "R.I.P.",
            aliases: []
        },
        {
            title: "Empire",
            aliases: []
        },
        {
            title: "DropDown",
            aliases: []
        },
        {
            title: "Contact",
            aliases: []
        },
        {
            title: "CANDYLAND",
            aliases: []
        },
        {
            title: "Arcade ViruZ",
            aliases: []
        },
        {
            title: "LINK x LIN＃S",
            aliases: []
        },
        {
            title: "LEONIDS",
            aliases: []
        },
        {
            title: "FORTALiCE",
            aliases: []
        },
        {
            title: "Paradial Resonator",
            aliases: []
        },
        {
            title: "Lavender Leaf (feat. Lexi)",
            aliases: []
        },
        {
            title: "Puppet Show",
            aliases: []
        },
        {
            title: "Vicious Mockery",
            aliases: []
        },
        {
            title: "BRAVE: ROAD",
            aliases: []
        },
        {
            title: "Dot-Line (feat. ななひら)",
            aliases: []
        },
        {
            title: "光 (阿卡姆巫师 Remix)",
            aliases: []
        },
        {
            title: "Lost Future",
            aliases: []
        },
        {
            title: "sAtElLites",
            aliases: []
        },
        {
            title: "Intruder",
            aliases: []
        },
        {
            title: "Rule The World",
            aliases: []
        },
        {
            title: "felys -final remix-",
            aliases: []
        },
        {
            title: "Destr0yer",
            aliases: []
        },
        {
            title: "crystallized",
            aliases: []
        },
        {
            title: "Cosmos Capsule",
            aliases: []
        },
        {
            title: "Yellow Shining!! feat. 成田なる",
            aliases: []
        },
        {
            title: "Abatement",
            aliases: []
        },
        {
            title: "Rapture",
            aliases: []
        },
        {
            title: "Turning POINT",
            aliases: []
        },
        {
            title: "Reversed Zenith",
            aliases: []
        },
        {
            title: "Restricted Access",
            aliases: []
        },
        {
            title: "The Last Page",
            aliases: []
        },
        {
            title: "Super Universe (Knighthood Remix)",
            aliases: ["超宇宙", "Super Universe Remix"]
        },
        {
            title: "Enneaquest",
            aliases: []
        },
        {
            title: "Colorful Flavor",
            aliases: []
        },
        {
            title: "Abiogenesis",
            aliases: []
        },
        {
            title: "Revenant",
            aliases: []
        },
        {
            title: "Antler",
            aliases: []
        },
        {
            title: "Contortion",
            aliases: []
        },
        {
            title: "Bring Me Back",
            aliases: []
        },
        {
            title: "Hullbreaker",
            aliases: []
        },
        {
            title: "D-Birth",
            aliases: []
        },
        {
            title: "NightTheater",
            aliases: ["夜剧院", "夜剧场", "Night Theater", "NT"]
        },
        {
            title: "Grimheart",
            aliases: []
        },
        {
            title: "Encrux",
            aliases: []
        },
        {
            title: "slic.hertz",
            aliases: []
        },
        {
            title: "Giselle",
            aliases: []
        },
        {
            title: "Afterdark",
            aliases: []
        },
        {
            title: "蒼天 (Sta's Key-Kai mix)",
            aliases: []
        },
        {
            title: "Conway's Child",
            aliases: []
        },
        {
            title: "Crimsonate",
            aliases: []
        },
        {
            title: "Sthenno",
            aliases: []
        },
        {
            title: "Kaguya",
            aliases: []
        },
        {
            title: "Relieve",
            aliases: []
        },
        {
            title: "Alexandrite",
            aliases: []
        },
        {
            title: "Hydra",
            aliases: []
        },
        {
            title: "漂流",
            aliases: []
        },
        {
            title: "Comet Coaster",
            aliases: []
        },
        {
            title: "DOMINATOR",
            aliases: []
        },
        {
            title: "天灵灵地灵灵",
            aliases: []
        },
        {
            title: "Psychometry",
            aliases: []
        },
        {
            title: "Electric Comet",
            aliases: []
        },
        {
            title: "Eschatology",
            aliases: []
        },
        {
            title: "너를 그리는 밤하늘의 이야기 (Planetarium) prod. Scarlette",
            aliases: []
        },
        {
            title: "Avataar ~Reincarnation of Kalpa~",
            aliases: []
        },
        {
            title: "Frozen Heart",
            aliases: []
        },
        {
            title: "amethyst",
            aliases: []
        },
        {
            title: "Alfheim's faith",
            aliases: []
        },
        {
            title: "翠杜",
            aliases: []
        },
        {
            title: "驟雨の狭間",
            aliases: []
        },
        {
            title: "enchanted love",
            aliases: []
        },
        {
            title: "Crazy Audiophile",
            aliases: []
        },
        {
            title: "419kB",
            aliases: []
        },
        {
            title: "VICIOUS",
            aliases: []
        },
        {
            title: "Crush Alcohol",
            aliases: []
        },
        {
            title: "インフェルノシティ",
            aliases: []
        },
        {
            title: "No-name Requiem",
            aliases: []
        },
        {
            title: "Change the Game feat. 松永依織",
            aliases: []
        },
        {
            title: "T+ VS SHARK",
            aliases: []
        },
        {
            title: "Future Downloader",
            aliases: []
        },
        {
            title: "Echo over you...",
            aliases: []
        },
        {
            title: "Fairy's Crown",
            aliases: []
        },
        {
            title: "Graves -Ancient Memories-",
            aliases: []
        },
        {
            title: "Clouds clear and...",
            aliases: []
        },
        {
            title: "NLAMTA",
            aliases: []
        },
        {
            title: "Antikythera",
            aliases: []
        }
    ]

</script>

</html>