如何理解JS
我们之前讲了html入门，就像是做机器人的外壳，但是光有外壳，再好看也华而不实，也可以理解成你想要一个好看的机器人，同时也想它能做家务勤劳啥的
JavaScript是一种网络的脚本语言,一般用于web开发
实现web中功能
js是解释型语言，我们在编译c语言时，会发现下面有个编译成功，然后出现exe文件，再运行exe文件，就是直接编译成机器语言，但是js不是编译后运行，而是边运行边解释，不直接生成机器语言，先生产中间代码，然后由解释器边解释边运行
ECMAScript 6.0 简称ES6:是JS的版本标准，2015.06 发版。
重要的事情说三遍，多看文档
JavaScript
ES6
JS—赋予网页生命
一个简单的小示例带你了解js的效果
首先，给网页一个"脸"
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
.head{
width: 180px;height: 130px;border: 1px solid black;
}
.hair{
width: 180px;height: 30px;background-color: black;color: white;text-align: center;
}
.beard{
width: 180px;height: 15px;background-color: black;color: white;text-align: center;position: relative;top: 62px;font-size: 5px;
}
</style>
</head>
<body>
<div class="head">
<div class="hair">头发</div>
<div style="position: relative;left: 18px;top: 5px;">
<input type="button" value="左眼" />
<input type="button" value="右眼" style="position: relative;left: 50px;" />
<input type="button" value="嘴巴" style="position: absolute;left: 50px;top: 50px;"/>
</div>
<div class="beard">胡子</div>
</div>
</body>
</html>
让脸动起来
点击头发，头发消失
我们让点击左眼出现眨眼动作
点击右眼切换眼睛
点击嘴巴说话(有语音，动图无法展示，自行脑补，语音内容:我是代码哈士奇，可以在网上找在线语音合成自行合成mp3使用，或者播放自己的mp3文件)
点击胡子有惊喜
<body>
<div class="head">
<div class="hair" id="hair" onclick="noHair()">头发</div>
<div style="position: relative;left: 18px;top: 5px;">
<input type="button" value="左眼" id="leftEye" style="height: 22px;" onclick="blinkEye()"/>
<input type="button" value="右眼" id="rightEye" style="position:absolute;left: 100px;" onclick="changeEyse()"/>
<input type="button" value="嘴巴" style="position: absolute;left: 50px;top: 50px;" onclick="speak()"/>
</div>
<div class="beard" id="beard" onclick="changeBeard()">胡子</div>
</div>
<script type="text/javascript">
function noHair(){
let hair = document.getElementById("hair");
hair.style.backgroundColor = "white";
setTimeout(function(){
alert("头发都没有");},1000)
}
function blinkEye(){
let leftEye = document.getElementById("leftEye");
leftEye.style.height = "2px";
setTimeout(function(){
leftEye.style.height="22px"},100)
}
function changeEyse(){
let rightEye = document.getElementById("rightEye");
if(rightEye.type=="button"){
rightEye.type = "image";
rightEye.src = "./eye.PNG";
}else{
rightEye.type = "button";
}
}
function speak(){
let audio = new Audio("./speak.mp3");
audio.play();
}
function changeBeard(){
let beard = document.getElementById("beard");
beard.innerText = "我是小可爱";
}
</script>
</body>
是不是很好玩呢
我们自己定义了一张脸，定义了脸的功能。
从这篇文章开始 我们开始学习js基础
让我们一起让脸动起来吧！加油！奥里给！
学习JS的方法
多学多练习多看文档
JavaScript手册
ES6教程
大家好，我是代码哈士奇，是一名软件学院网络工程的学生，因为我是“狗”，狗走千里吃肉。想把大学期间学的东西和大家分享，和大家一起进步。但由于水平有限，博客中难免会有一些错误出现，有纰漏之处恳请各位大佬不吝赐教！暂时只在csdn这一个平台进行更新，博客主页：https://blog.csdn.net/qq_42027681。
未经本人允许，禁止转载
后续会推出
前端：vue入门 vue开发小程序 等
后端： java入门 springboot入门等
服务器：mysql入门 服务器简单指令 云服务器运行项目
python：推荐不温卜火 一定要看哦
一些插件的使用等
大学之道亦在自身，努力学习，热血青春
如果对编程感兴趣可以加入我们的qq群一起交流：974178910
有问题可以下方留言，看到了会回复哦