写的错的代码：
<!DocType>
<html>
<div>
<button :click = "ddd" type="text">display button</button>
alert('hamimelon!')
</div>
</html>
一步步修改的代码
第二次思考
<!DocType>
<html>
<body> //为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
<type= 'text/javascript'>
<div>
<button :click = "ddd" type="text">display button</button>
alert('hamimelon!')
</div>
<script>
<input
</script>
</body>
</html>
第三次思考
还是差的远啊
<!DocType>
<html>
<body> //为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
<type= 'text/javascript'>
<div>
function display_alert() {
alert('hamimelon!')
//怎么调用alert函数？
}
</div>
<script>
<button :click = "desplay_alert" type="text">display button</button>
</script>
</body>
</html>
第四次思考
<!DocType>
<html>
<head> //漏了，为什么要写head？
<script type="text/javascript"> //<type= 'text/javascript'>我写的是这个
<div>
function display_alert() {
//这段倒是没有错，难得
alert('hamimelon!') //应该是双引号，单引号是不是也行？拿不准，还有缩进，糊了
//怎么调用alert函数？--见以上
}
</div>
</script>
</head>
<body> //为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
//刚才一堆乱码，是因为body里面多了script标签
//应该怎样加注释，head和body后不能加注释吗？
<input type="button" :click = "desplay_alert" >
//input是什么标签，为什么在这里要用这个，不能直接用button？
//click里头应该跟什么？desplay函数吗？
//<input type="button" :click = "desplay_alert" >
// <button :click = "desplay_alert" type="text">display button</button>
</body>
</html>
第五次思考：vscode里的注释应该怎么加？
<!DocType>
<html>
<head>
<script type="text/javascript"> //<type= 'text/javascript'>我写的是这个
<div>
function display_alert() {
//这段倒是没有错，难得
alert('hamimelon!') //应该是双引号，单引号是不是也行？拿不准，还有缩进，糊了
//怎么调用alert函数？--见以上
//为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
//刚才一堆乱码，是因为body里面多了script标签
//应该怎样加注释，head和body后不能加注释吗？
//input是什么标签，为什么在这里要用这个，不能直接用button？
//click里头应该跟什么？desplay函数吗？
//漏了，为什么要写head？
}
</div>
</script>
</head>
<body>
<input type="button" :click = "desplay_alert" >
//<input type="button" :click = "desplay_alert" >
// <button :click = "desplay_alert" type="text">display button</button>
</body>
</html>
第六次思考
<!DocType>
<html>
<head>
<script type="text/javascript"> //<type= 'text/javascript'>我写的是这个
<div>
function display_alert() {
//这段倒是没有错，难得
alert('hamimelon!') //应该是双引号，单引号是不是也行？拿不准，还有缩进，糊了
//怎么调用alert函数？--见以上
//为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
//刚才一堆乱码，是因为body里面多了script标签
//应该怎样加注释，head和body后不能加注释吗？
//input是什么标签，为什么在这里要用这个，不能直接用button？
//click里头应该跟什么？desplay函数吗？
//漏了，为什么要写head？
}
</div>
</script>
</head>
<body>
<input type="button" :click = "desplay_alert()" value="显示消息框" > //忘记写小括号了，以为调用的是函数名字即可，没想到要调用函数
//不知道要写value
//value里面应该怎么填呢？除了点显示消息框外，还能不能填别的？
</body>
</html>
第七次思考：没有起作用，弹窗没有弹，是不是click写得不对
<!DocType>
<html>
<head>
<script type="text/javascript"> //<type= 'text/javascript'>我写的是这个
<div>
function display_alert() {
//这段倒是没有错，难得
alert('hamimelon!') //应该是双引号，单引号是不是也行？拿不准，还有缩进，糊了
//怎么调用alert函数？--见以上
//为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
//刚才一堆乱码，是因为body里面多了script标签
//应该怎样加注释，head和body后不能加注释吗？
//input是什么标签，为什么在这里要用这个，不能直接用button？
//click里头应该跟什么？desplay函数吗？
//漏了，为什么要写head？
//忘记写小括号了，以为调用的是函数名字即可，没想到要调用函数
//不知道要写value
//value里面应该怎么填呢？除了点显示消息框外，还能不能填别的？
}
</div>
</script>
</head>
<body>
<input type="button" :click = "desplay_alert()" value="显示消息框" >
</body>
</html>
第八次思考：把：click改成onclick了还是不对
<!DocType>
<html>
<head>
<script type="text/javascript"> //<type= 'text/javascript'>我写的是这个
<div>
function display_alert() {
//这段倒是没有错，难得
alert('hamimelon!') //应该是双引号，单引号是不是也行？拿不准，还有缩进，糊了
//怎么调用alert函数？--见以上
//为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
//刚才一堆乱码，是因为body里面多了script标签
//应该怎样加注释，head和body后不能加注释吗？
//input是什么标签，为什么在这里要用这个，不能直接用button？
//click里头应该跟什么？desplay函数吗？
//漏了，为什么要写head？
//忘记写小括号了，以为调用的是函数名字即可，没想到要调用函数
//不知道要写value
//value里面应该怎么填呢？除了点显示消息框外，还能不能填别的？
}
</div>
</script>
</head>
<body>
<input type="button" onclick = "desplay_alert()" value="显示消息框" >
</body>
</html>
第九次思考：少写了一个/号加上了，还是不对
<!DocType>
<html>
<head>
<script type="text/javascript"> //<type= 'text/javascript'>我写的是这个
<div>
function display_alert() {
//这段倒是没有错，难得
alert('hamimelon!') //应该是双引号，单引号是不是也行？拿不准，还有缩进，糊了
//怎么调用alert函数？--见以上
//为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
//刚才一堆乱码，是因为body里面多了script标签
//应该怎样加注释，head和body后不能加注释吗？
//input是什么标签，为什么在这里要用这个，不能直接用button？
//click里头应该跟什么？desplay函数吗？
//漏了，为什么要写head？
//忘记写小括号了，以为调用的是函数名字即可，没想到要调用函数
//不知道要写value
//value里面应该怎么填呢？除了点显示消息框外，还能不能填别的？
}
</div>
</script>
</head>
<body>
<input type="button" onclick = "desplay_alert()" value="显示消息框" />
</body>
</html>
第十次思考：是不是注释闹的？除此以外，没看出有什么不对的了
<!DocType>
<html>
<head>
<script type="text/javascript"> //<type= 'text/javascript'>我写的是这个
<div>
function display_alert() {
//这段倒是没有错，难得
alert('hamimelon!') //应该是双引号，单引号是不是也行？拿不准，还有缩进，糊了
//怎么调用alert函数？--见以上
//为什么要加body，不加行不行？
//什么是js代码，什么是html代码？是不是dom就是js了？
//刚才一堆乱码，是因为body里面多了script标签
//应该怎样加注释，head和body后不能加注释吗？
//input是什么标签，为什么在这里要用这个，不能直接用button？
//click里头应该跟什么？desplay函数吗？
//漏了，为什么要写head？
//忘记写小括号了，以为调用的是函数名字即可，没想到要调用函数
//不知道要写value
//value里面应该怎么填呢？除了点显示消息框外，还能不能填别的？
}
</div>
</script>
</head>
<body>
<input type="button" onclick = "desplay_alert()" value="显示消息框" />
</body>
</html>
第十次思考：删掉注释，还是不行
<!DocType>
<html>
<head>
<script type="text/javascript">
<div>
function display_alert() {
alert('hamimelon!')
}
</div>
</script>
</head>
<body>
<input type="button" onclick = "desplay_alert()" value="显示消息框" />
</body>
</html>
第十一次思考：删掉！doctype还是不行
第十二次思考，删掉div还是不行
第十三次思考，display_alert单词拼错了，跟前面定义的不一样，再试试。
还是不行？！！！
<html>
<head>
<script type="text/javascript">
function display_alert()
{
alert('hamimelon!')
}
</script>
</head>
<body>
<input type="button" onclick = "display_alert()" value="显示消息框" />
</body>
</html>
第十四次思考：好像display_alert()函数的右半边括号写成了半角
<html>
<head>
<script type="text/javascript">
function display_alert()
{
alert('hamimelon!')
}
</script>
</head>
<body>
<input type="button" onclick = "display_alert()" value="显示消息框" />
</body>
</html>
终于好了，好像也不是半角的事儿，到第十三步就好了，还是单词拼写错了
另外alert函数里单引号和双引号都可啊，下次要知道了。
我在看看没有value会发生什么，报什么错？
第十五次思考
没有value，dom也能实现，只是按钮里头没有文字了，也可以点开，出弹窗
用input而不用button的原因是需要value这个值吧。
第十六次思考：为什么：click不行呢
因为这是js，不是vue，如果是vue要引用
<html>
<head>
<script type="text/javascript">
function display_alert()
{
alert('hamimelon!')
}
</script>
</head>
<body>
<input type="button" :click = "display_alert()" value="wo shi yige " />
</body>
</html>
第十七次思考：引用vue的方法不对
<html>
<head>
<script type="text/javascript">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
function display_alert()
{
alert('hamimelon!')
}
</script>
</head>
<body>
<input type="button" :click = "display_alert()" value="wo shi yige " />
</body>
</html>
这样也不对
<html>
<head>
<script type="text/javascript"> </script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
function display_alert()
{
alert('hamimelon!')
}
</head>
<body>
<input type="button" :click = "display_alert()" value="wo shi yige " />
</body>
</html>
第十八次思考：调换了一下位置，不报错了，但是还是不弹窗
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script type="text/javascript">
function display_alert()
{
alert('hamimelon!')
}
</script>
</head>
<body>
<input type="button" :click = "display_alert()" value="wo shi yige " />
</body>
</html>
第十九次思考：
可能是：click的写法不对吗？
：改成@click了，也还是不对，不弹窗。
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script type="text/javascript">
function display_alert()
{
alert('hamimelon!')
}
</script>
</head>
<body>
<input type="button" @click = "display_alert()" value="wo shi yige " />
</body>
</html>
是不是@click后 vue一定要跟
Vue.createApp({
data() {
return {
counter: 0
}
}
}).mount('#basic-event')
这样的代码才可以？
想不清楚了