如题，外甥半岁了，前几天刚会叫爸爸妈妈爹爹奶奶，就是不会叫舅舅。为了逗孩子开心，用AI开发了这款小工具！

最近deepseek比较火，但是无奈被攻击导致一直显示“服务器繁忙，请稍后再试。”

还是不耽误时间了，就用我的神器——豆包吧！别问为什么不用腾讯云AI代码助手，主要就是我下载了豆包桌面版，比较熟悉也方便调用。

这个系统是参考某少儿编程项目的，我直接输入网页，让豆包做一个一样的。

需要注意的是，熟知我网站习惯的人都知道，我一般都是用php和html代码的，其他的我也暂时没有涉及。

这个项目中，比较简单，只有一个html、js、css，如图（css和js文件中都只有一个文件）：

这里多了一个bootstrap文件夹完全是为了使用本地css和js，提升网站加载的。

我们了解了这个结构，现在我们再讲讲整个编写过程吧！

AI在生成初始网页代码时，一般很难做到100%的完成度，所以需要简单的调试：

对于分开的js和css文件，我直接加载到html主页中，直接给AI去检测问题，直接抛出问题“为什么点击按钮不能出题”，这里我们自己分析就是js绑定关系或者是js逻辑的问题，这个时候AI就直接理解并发现了问题，甚至还帮我们做了一个逻辑问题上的提示，便于我们更容易发现问题所在。

接下来逻辑没问题了，就是要做样式的排版了。别问为什么解决的这么快，一个小学问题AI真的不在话下。

如上图，我直接告诉AI要在打开页面的时候就自动生成6个题目，然后默认选择就是6个题目，等于号后面还要加一个空，还给出了一个例子的演示，便于AI理解。

然后进行细节微调，这里不做强调，比较简单：

最重要的是，我们在操作上的设置问题，就是按钮的排版，我设置的就是三个按钮平铺在一行，但是AI给我的是将显示答案的功能设置成了一个开关：

<div class="form-check text-center my-3">
     <input class="form-check-input" type="checkbox" id="showAnswers">
     <label class="form-check-label" for="showAnswers">显示答案</label>
</div>

然后我才发现，在我的表述中，本身就是让这个显示答案的功能设置成了开关，从这里就能看出，我们在引导AI的时候一定要用确定且正确的方法，请勿模棱两可，使用不切当的表述。

然后我直接把我的要求直接一并给了AI，让AI知道我试图让他完整地明白我的需求，就像在给AI一项目的策划方案一样。

由于我要设置一个打印功能，方便我外甥能够自助打印数学难题，所以我不断地调整逻辑和样式：

解决了所有问题之后，我们就可以对整个网页进行TDK的设置了，就是网页SEO的简单优化，这个对AI来说简直小菜一碟。

好了，整个项目就到这里结束了，看看最终的成品吧！

好了，这样，我外甥一定会感谢我的！相信你也学会了，赶紧动手起来，用

也做一个出来吧！年后给熊孩子送礼物的不二之选！

没啥新年礼物送给外甥的，就用AI做个随机数学题生成器吧!

赶紧动手起来，用腾讯AI代码助手也做一个出来吧！年后给熊孩子送礼物的不二之选！

会员

人工智能

前端

文章

没啥新年礼物送给外甥的，就用AI做个随机数学题生成器吧!

没啥新年礼物送给外甥的，就用AI做个随机数学题生成器吧!

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐