年前的时候自学过一段时间的html+css,讲真,这一块是我的兴趣点,但有时候真的觉得很无力,怀疑自己的审美,强迫症晚期的人伤不起啊,各种调整,各种不美好……
现在来到了js,三兄弟即将合体,希望我能沉迷其中吧~~
首先写了一个js脚本,效果是用引号中的内容去替代id为“we”中的html内容:
function myFirst() { document.getElementById("we").innerHTML="这里是最新的内容……"; }
然后在主页中去调用它,当点击按钮时函数myFirst()将被调用:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>初识JS</title> <script src="js/MyFirst.js"></script> </head> <body> <p>正式进军JS~~~</p> <h1 id="we">这里是将要被代替的内容!</h1> <button onclick="myFirst()">见证奇迹</button> </body> </html>
在<head>中我们引入了js,注意在<script>和</script>之间是不能写东西的……
当然,这是用的外部js,我们还可以在<head>或<body>里写js,就像css一样,不过为了美观性和可扩展性还是建议用这种方式~~
看效果:
初始状态:
点击按钮后:
还有个问题,标签<button>中可以设置type,即按钮的类型,大多数浏览器默认的是button,但对于本次内容,设置submit或者reset的效果是一样的,我想应该是跟具体的操作有关吧,如果用于<input>时就能体现出二者的差别的,这个以前貌似搞过……