T) K# W$ y& g: H; f% I( R
ai绘画不知火舞在程序生产过程中,如果想快捷地生成一个小功能,我们可以使用AI的AI问答功能来让人工智能帮我们完成如何在线AI写代码的操作。下面来个粟子:
/ E8 \* _, g% C C 首先打开AI官网:移到菜单栏Ai写作处,选择需要的版本,作者选择的是“问答3.5”,点开后按要求登录,然后选择问答3.5
& d) J% N$ C+ }8 K- Q- `+ P; [ 然后进入问答界面:: B- _7 [" B E. z) \
然后开始让Ai帮我们写代码,作者本次让Ai写一个原生JS的简单计算器:
! V o9 K: _; x- x 提问时输入:“我希望你担任资深javascript技术员。你现在需要帮我用javascript写一个计算器代码,并且可以验算是否正确”,如下图
+ j5 @1 z; F, W) t- p: r# x" ? 然后点发送按钮,稍等片刻之后Ai智能就能回答正确的程序出来了
0 z+ ~5 f( {/ {& k) ^ U 首先返回一段JS代码:7 {2 u2 b2 A! |9 e+ X- j
// 获取计算器的按钮和显示屏元素
3 |# Y- I# b1 n# _( L9 B9 ?/ x7 B const buttons = document.querySelectorAll('.button');+ ~. ^. I9 Q7 @3 i- I
const display = document.querySelector('.display');
, ~0 e" `6 b" C T, v" ] [& Q% M // 为每个按钮添加点击事件监听器
@. F( E( h3 Q& s buttons.forEach(button => {+ p% h7 q3 l" Z, F" W6 L
button.addEventListener('click', () => {
, z% i8 H( g. j# C- `. i3 y$ J0 J3 T/ H const buttonText = button.textContent;5 T$ ~7 I0 a h9 U$ r1 i8 |2 V
if (buttonText === '=') {
/ @& j$ O6 h4 C4 ?! g! s // 如果点击的是等号,则计算表达式结果# d6 k- [$ D7 O6 n' z; h
try {
& k5 s2 S. C$ _6 ^5 {% @: f const result = eval(display.value);
; v2 d/ y X: A; j8 @9 o( ~# x display.value = result;
9 }) p& N$ ?, u; K" {3 e } catch (error) {2 i1 ~9 \0 M! n) v% {5 x
display.value = 'Error';
* G1 |0 F; Q' h }8 Z/ z" m4 s! e1 J
} else if (buttonText === 'C') {% j9 ]( B. H% P! ~, `1 p
// 如果点击的是清除按钮,则清空显示屏
: Y$ V0 U1 U- r display.value = '';9 D$ d& X- y0 k, U7 V. r) I
} else {
2 U( l( R* { _ b# [& q/ n# f // 否则将按钮的文本内容添加到显示屏上
! `3 u% q$ }: [. W display.value += buttonText;
1 E3 A0 C; y( b$ R1 q' L }
$ A$ H6 `5 }6 l9 r! G });
1 _; q ?5 ]& \! l1 L+ q });
- M4 H$ n, z% R& H. d2 M 然后返回承载的HTML代码:! ~& V4 B9 P# E$ u% b
<input type="text" class="display">
% v2 P. p* [$ g8 m <div class="calculator">
, w! @/ _1 M+ D U0 Q0 q' b <div class="row">) q) O+ m# \2 X
<button class="button">7</button>4 G: P b" q% y& a) f1 C' x# b
<button class="button">8</button>
; `% J: p# W' M$ [" L# A <button class="button">9</button>
4 ^5 {# L7 X& F# C( j* c/ ] <button class="button">/</button>3 R q+ X( q! O
</div>. K+ N. m8 c6 w( ^- N/ @) n1 n
<div class="row">. k* m. b& b" h) N, D1 u
<button class="button">4</button>8 I- N) g7 ?: E' s! y( r( s
<button class="button">5</button>, o; n4 i7 D8 p; t7 Z
<button class="button">6</button>
& D/ M# i% H5 R6 j" O d$ { <button class="button">*</button>) u, b7 b1 D8 M, b. G7 ]
</div>, K; h5 {8 }2 {) m* c
<div class="row">
0 a: z! F0 x( a0 y! o <button class="button">1</button>$ ]) N" `8 o# q/ V) K$ |
<button class="button">2</button>
. U+ U$ [. O1 S+ u <button class="button">3</button>
4 C, y! s5 z; Y7 p, | <button class="button">+</button>8 _& y4 `5 A+ @- J
</div>
; w, r/ C' M- z/ e <div class="row">: y: C: t2 h" _4 ?2 F
<button class="button">0</button>1 H- n# M+ E2 U/ t9 h" M
<button class="button">.</button>5 Z; t" N3 W, V' W5 }# \
<button class="button">=</button>
( J1 e7 m1 y: B% k8 n- X <button class="button">-</button>; X; ?: I3 C8 D2 g
</div>
5 T7 g! {, Z6 B# G8 A <div class="row">
: i, k' f1 X, u <button class="button">C</button>; V! @0 e( ~0 T9 Q( h" u
</div>
( V. J- m6 j# U </div>5 F! g2 y0 a/ ]( t, T
以下为最终效果展示:
% ~' _% Q$ p: _9 E; v0 k4 C AI写代码可以快捷地帮我们完成一些简单的代码需求,它可以根据你输入的不同描述需求做成大致的样子,然后在根据AI写代码的结果进行调整使用。& }5 g' i/ H) a e) g% K
' n7 e7 C8 [0 G# q% j3 W0 [
|