JavaScript基础，来自“菜鸟教程”JavaScript实例练习【一】

“菜鸟教程”中的JavaScript实例练习，从前往后对应，编辑器用的HBuilderX，新建项目，在项目下新建.js文件，在里面加代码就可以运行啦～

<h1>first点击按钮，绑定事件，时间函数显示时间</h1>
		<button onclick="displayDate()">按钮</button>
		<script>
			function displayDate(){
				document.getElementById("demo").innerHTML=Date();
			}
		</script>
		<p id="demo"></p>
		
		<h1>second,利用id(js)改变HTML元素</h1>
		<p id="demo2">我的第二个小例子</p>
		<script>
			document.getElementById("demo2").innerHTML="第二个小例子已经修改！"
		</script>
		
		<h1>third,外部js文件</h1>
		<p id="demo3">一个段落</p>
		<button type="button" onclick="myfun3()">按钮3</button>
		<p><b>注释：</b>myfun3保存在web.js的外部文件中</p>
		<script src="web.js"></script>
		
		<h1>fourth定义一个变量，赋值，打印，再赋值，可继续打印出来</h1>
		<script>
			var firstname;
			firstname="Hege";
			document.write(firstname);
			document.write("<br>");
			firstname="Tove";
			document.write(firstname);
		</script>
		
		<h1>fifth,if语句</h1>
		<p>如果时间早于20:00，会获得问候“Good day”;基于时间的问候</p>
		<button onclick="myfun5()">点击这里</button>
		<p id="demo5"></p>
		<script>
			function myfun5(){
				var x="";
				var time=new Date().getHours();
				if(time<20){
					x="Good day!";
				}
				else{
					x="Good evening";
				}
				document.getElementById("demo5").innerHTML=x;
			}
		</script>
		
		<h1>sixth，random links</h1>
		<p>Math 对象用于执行数学任务,random 返回 0 ~ 1 之间的随机数,所有的HTML元素都是元素节点,href 属性是一个可读可写的字符串，可设置或返回当前显示的文档的完整 URL。</p>
		<p>a标签定义超链接，用于从一个页面链接到另一个页面。元素最重要的属性是 href 属性，它指定链接的目标。</p>
		<p id="demo6"></p>
		<script>
			var r=Math.random();
			var x=document.getElementById("demo6");
			if(r>0.5){
				x.innerHTML="<a href='http://www.runoob.com'>访问菜鸟教程</a>";
			}
			else{
				x.innerHTML="<a href='https://www.baidu.com/'>访问百度</a>";
			}
		</script>
		
		<h1>seventh,switch语句</h1>
		<p>点击按钮显示今天周几</p>
		<button onclick="myfunc7()">按钮</button>
		<p id="demo7"></p>
		<script>
			function myfunc7(){
				var x;
				var d=new Date().getDay();
				switch(d){
					case 0:x="Sunday";
					break;
					case 1:x="Monday";
					break;
					case 2:x="Tuesday";
					break;
					case 3:x="Wednesday";
					break;
					case 4:x="Thursday";
					break;
					case 5:x="Friday";
					break;
					case 6:x="Saturday";
					break;
				}
				document.getElementById("demo7").innerHTML=x;
			}
		</script>
		
		<h1>eighth,alert、confirm、prompt</h1>
		<p>meta标签提供了 HTML 文档的元数据。元数据不会显示在客户端，但是会被浏览器解析。</p>
		<p>\n是换行符</p>
		<script>
			function myFun8(){
				alert("你好!\n我是警告框！");
			}
		</script>
		<input type="button" onclick="myFun8()" value="显示警告框"/>	
		<p>确认框，点击确认或者取消</p>
		<button onclick="myfun9()">确认框</button>
		<p id="demo9"></p>
		<script>
			function myfun9(){
				var x;
				var c=confirm("这是一个确认框！");
				if(c==true){
					x="You clicked the 'confirm' button!"
				}else{
					x="You clicked the'cancel' button!"
				}
				document.getElementById("demo9").innerHTML=x;
			}
		</script>
		<p>提示框，点击按钮查看输入的对话框。prompt()方法用于显示可提示用户进行输入的对话框。这个方法返回用户输入的字符串，语法是prompt(msg,defaultText)。</p>
		<button onclick="myfunc10()">提示框</button>
		<p id="demo10"></p>
		<script>
			function myfunc10(){
				var x;
				var person=prompt("请输入你的名字","小明");
				if(person!=null && person!=""){
					x="Hello"+person+"!How are you?";
					document.getElementById("demo10").innerHTML=x;
				}
			}
		</script>

最近在看前端的东西，工作快一年来，还是有点迷茫，只能低头学东西了，没准学着学着就知道自己要干什么了，欢迎各位大佬给意见，跪谢～

后面还会更新一些…
源文件放到下一篇里