开辟者大年夜赛路演 | 12月16日，技巧立异，北京不见不散

前几天完成了一个需求，在网页中完成鼠标指向哪里，就用语音读出所指的文本。如不雅是按钮、链接、文本输入框，则还还要给出是什么的提示。同时针对大年夜段的文本，不克不及整段的去读，要按照标点符号进行断句处理。

重合适然就是先获取到当前标签汕９依υ?本，再把文本转化成语音即可。

标签朗读

这个很简单了，只用根据当前是什么标签，给出提示即可。

// 标签朗读文本 
var tagTextConfig = { 
    'a': '链接', 
    'input[text]': '文本输入框', 
    'input[password]': '暗码输入框', 
    'button': '按钮', 
    'img': '图片' 
}; 

还有须要朗读的标签，持续再添加即可。

然后根据标签，返回前缀文本即可。

/** 
* 获取标签朗读文本 
* @param {HTMLElement} el 要处理的HTMLElement 
* @returns {String}   朗读文本 
*/ 
function getTagText(el) { 
    if (!el) return ''; 
 
    var tagName = el.tagName.toLowerCase(); 
 
    // 处理input等多属性元素 
    switch (tagName) { 
        case 'input': 
            tagName += '[' + el.type + ']'; 
            break; 
        default: 
            break; 
    } 
 
    // 标签的功能提示和感化应当有距离，是以在最后参加一个空格 
    return (tagTextConfig[tagName] || '') + ' '; 
} 

获取完全的朗读文本就更简单了，先取标签的功能提示，另娶标签的文本即可。

文本内容优先取 title 其次 alt 最后 innerText。

/** 
* 获取完全朗读文本 
* @param {HTMLElement} el 要处理的HTMLElement 
* @returns {String}   朗读文本 
*/ 
function getText(el) { 
    if (!el) return ''; 
 
    return	
			
 1/8    1 2 3 4 5 6 下一页 尾页
	
			

　　推荐阅读
　　固态硬盘寿命短？平衡算法来续命
            开辟者大年夜赛路演 | 12月16日，技巧立异，北京不见不散
            
                
                    
                
                硬件挖的坑真的可以经由过程软件来填吗？实际上不少硬>>>详细阅读


本文标题：网页中文本朗读功能开发实现分享
地址：http://www.17bianji.com/lsqh/39663.html
 1/2    1