浏览器上的可见即可说

1、语音转文字
2、在页面上找到对应文字，模拟点击

export function VisibleCanBeSaid() {
    var SpeechRecognition = SpeechRecognition || webkitSpeechRecognition;
    let recognition;
    let resultDisplay;
    let clearResultTimer;

    if (SpeechRecognition) {
        // 创建语音识别实例
        recognition = new SpeechRecognition();
        recognition.lang = 'zh-CN'; // 设置识别语言为简体中文
        recognition.continuous = false; // 设置为非持续监听
        recognition.interimResults = false; // 不返回临时结果

        // 创建一个div元素用于显示语音识别结果
        resultDisplay = document.createElement('div');
        resultDisplay.style.cssText = 'position: fixed; top: 0; left: 0; width: 100%; background: #ddd; padding: 10px; z-index: 1000; color: red;';
        document.body.insertBefore(resultDisplay, document.body.firstChild); // 插入到body的最前面

        // 重置结果显示函数
        const resetResultDisplay = () => {
            clearTimeout(clearResultTimer); // 清除现有的定时器
            clearResultTimer = setTimeout(() => {
                resultDisplay.textContent = ''; // 清空显示结果
                // 清空后不立即开始监听，等待onend事件触发
            }, 3000); // 设置定时器，3秒后清空结果
        };

        // 当语音识别开始时触发
        recognition.onstart = function () {
            console.log('语音识别开始');
        };

        // 当成功识别到语音命令时触发
        recognition.onresult = function (event) {
            let last = event.results[event.results.length - 1];
            let command = last[0].transcript.trim();
            // 更新显示结果的div元素
            resultDisplay.textContent = `识别结果: ${command}`;
            SimulateClick(command)
            resetResultDisplay(); // 重置结果显示
        };

        // 当语音识别错误时触发
        recognition.onerror = function (event) {
            console.error('语音识别错误:', event.error);
        };

        // 当语音识别结束时触发
        recognition.onend = function () {
            console.log('语音识别结束');

            // 清空显示结果后重新开始监听
            recognition.start();
        };

        // 开始监听语音命令
        recognition.start();
    } else {
        alert('您的浏览器不支持语音识别！');
    }
}

export function SimulateClick(str) {
    console.log(str, '结果')
    // 等待页面加载完成
    // document.addEventListener('DOMContentLoaded', function() {
    // 获取页面中所有的data-voice-command元素
    var voiceCommands = document.querySelectorAll('[data-voice-command]');

    // 遍历这些元素
    voiceCommands.forEach(function (element) {
        console.log(element)
        console.log(element.textContent)
        console.log(element.textContent.trim())
        // 检查元素的文本内容
        if (element.textContent.trim() === str) {
            // 如果文本内容等于'1'，触发模拟点击事件
            element.click();
        }
    });
    // });
}