基于一句话英语api写的前端调用

以前很害怕英语，没有学习途径和学习方法，这个是我觉得可以用作学习英语的一个api，索性就写个html 调用。可以用来学习。哈哈哈。

对于想自己开发的，API在这：

https://www.kekc.cn/2942.html

可以展示、隐藏中文或英文。还能播放音频，觉得不错的还可以复制音频链接下载音频。简单的一个html，大部分使用js实现，对于js不熟悉的人可以拿来简单学习。

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Ajax使用一言接口</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script>
            $.get('https://api.kekc.cn/api/yien',{},function(response){
                $('#cn').html(response.cn);
                $('#en').html(response.en);
                $('#audio').html(response.audio);
				$("#myaudio").attr("src",response.audio);
				document.getElementById("myaudio").loop = false;
				
            },'JSON');
        function get_Ajax(){
            $.get('https://api.kekc.cn/api/yien',{},function(response){
                $('#cn').html(response.cn);
                $('#en').html(response.en);
                $('#audio').html(response.audio);
				$("#myaudio").attr("src",response.audio);
				document.getElementById("myaudio").loop = false;
				
            },'JSON');
        }
        function Ajax_start(){
            //setInterval(get_Ajax,5000);
			get_Ajax();
        }
        function zhanshien(){
            //setInterval(get_Ajax,5000);
			$("#en").removeAttr("hidden");
        }
        function yincangen(){
            //setInterval(get_Ajax,5000);
			$("#en").attr("hidden","hidden");
			//$("a").attr("href","http://www.baidu.com");
        }
        function zhanshicn(){
            //setInterval(get_Ajax,5000);
			$("#cn").removeAttr("hidden");
        }
        function yincangcn(){
            //setInterval(get_Ajax,5000);
			$("#cn").attr("hidden","hidden");
			//$("a").attr("href","http://www.baidu.com");
        }
        function autoPlay() {
            var myAuto = document.getElementById('myaudio');
            myAuto.play();
        }
    </script>
    <style>
    table,tr,td{
        border: 4px solid yellowgreen;
        border-collapse: collapse;
    }

    </style>
</head>
<body>
<audio  id="myaudio" controls="controls" hidden="true"></audio>
    <table>
        <tr><td>中文：</td><td id="cn" hidden>无</td></tr>
        <tr><td>英文：</td><td id="en" hidden>无</td></tr>
        <tr><td>音频：</td><td id="audio">无</td></tr>
    </table>
    <input type="button" value="换一句" onclick="Ajax_start()"><input type="button" value="展示英文" onclick="zhanshien()"><input type="button" value="隐藏英文" onclick="yincangen()"><input type="button" value="展示中文" onclick="zhanshicn()"><input type="button" value="隐藏中文" onclick="yincangcn()"><input type="button" onclick="autoPlay()" value="播放" />
</body>
</html>

就70多行，简单的功能实现了。

文章版权声明 1、本网站名称：KEKC博客
2、本站网址：https://www.kekc.cn
3、本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长QQ2551654928进行删除处理。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报

THE END