JavaScript历史
原名LiveScript,美国网景公司开发，是一种脚本语言，在网页中使用，运行在浏览器，前段语言。
脚本语言：不需要编译的语言 sql python html css JavaScript 直接有某种解释器（引擎）解释执行，逐行从上到下解释执行。
JavaScript基本语法：
JavaScript代码写在名为：script标签里。
变量，数据类型
<script>/*java是强语言，声明变量：数据类型 值JavaScript是弱语言,变量没有类型，赋值什么，就是什么类型。使用var关键字声明*//* var a;a=10;//数值alert(a);a="abc";//字符串alert(a);var b=10;b= true;//布尔值alert(b); *//*数据类型*///1.数值类型[number] 包含整数和浮点数 // typeof()返回（）中变量的数据类型。var a=10;var b=10.50;//alert(typeof(b));//2.布尔类型var c=true;//alert(a==b);//3.字符串 ""和''都表示字符串.var d="abcde";//alert(typeof(d));var e='abcde';//alert(typeof(e));//4.undefined 类型(声明了变量，却没赋值)var g;//alert(g==undefined);//弹窗提示true//对象类型var date = new Date();//创建一个date类型对象。alert(date.getFullYear());//返回年份。alert(date.getMonth()+1);//返回今天第几个月份（12月份为第一个月）。alert(date.getDate());//返回今天本月第几天。</script>运算符
算数运算符 + - * / % ++ --
<script>//1.+ 加法运算 字符串连接功能。var a="10";var b=5;var c=10;var d="a";//alert(a+b);//字符串连接//alert(b+c);//加法运算//2.- 减法运算//alert(c-b);// 5 减法//alert(a-b);// 5 "(数字)字符串"-数值=数值 会把表达式里的数字字符串尝试进行类型转换。//alert(c-d);//NaN(not a number)无法计算。 如果字符串不能转换为数字，返回NaN。//3.除去+运算，其他运算都有转换数字字符串为数值的功能。//比较://alert(a==c);//只比较值是否相等//alert(a===c);//全等，比较值和类型/*if(a>b){alert(d);}for(i=0;i<5;i++){//for(int i;i<5;i++)【int】会报错。alert(i);}*/ </script>定义函数
<script>/*定义函数：*//* function test(){alert("你好");} *///因为变量接受所有类型的数值，所以给参数类型没必要。/* function test(a,b,c){alert(a+":"+b+":"+c);} *//* function test(a,b){return a+b;} *///函数调用//test();//test(true,10,new Date());/*var b=5;var c=test(10,b);alert(c);*/var a=10.5;var b="10.5a";var c=5;//系统中的全局函数 在系统中已经定义好的，可直接调用的函数。//alert(输出内容); 弹框显示。//parseInt(内容); 把括号中的内容转换成整数类型 //如果转换内容为字符串，字母不能开头，而且只将开头的数字部分转化。/* alert(parseInt(a));//浮点数转为整数，alert(parseInt(b)+c);//字符串数字转为整数。 *///parseFloat(); 把括号中的内容转换成浮点数类型 //alert(parseFloat(b)); //作用原理同parseInt。//typeof(内容) //获取括号中变量的数据类型。//typeof(a);//eval(传入字符串); //把传入的字符串可以当做js脚本执行。var s = "alert(2+3*2)";eval(s);</script>事件：
onclick: 点击标签时事件触发
onblur: 标签失去鼠标焦点时触发
onfocus: 标签刚得到鼠标焦点时触发，触发一次
onmouseover: 鼠标移入到标签上时触发
onmouseout: 鼠标移出到标签时触发
onload: 网页内容加载完毕后触发
onchange: 当内容改变且失去鼠标焦点时触发
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><script>function test(){console.log("事件被触发");}function test2(){alert(a+b);}</script></head><body onload="test()"><!-- onclick: 点击标签时事件触发onblur: 标签失去鼠标焦点时触发onfocus: 标签刚得到鼠标焦点时触发，触发一次onmouseover: 鼠标移入到标签上时触发onmouseout: 鼠标移出到标签时触发onload: 网页加载完毕后触发 onchange: 当内容改变且失去鼠标焦点时触发--><input type="button" value="单击" onclick="test()"/><br /><!-- 点击按钮时事件触发 --><div onclick="test()">单击事件</div><br /><!-- 点击标签时事件触发 --><input onblur="test()"/> <br /><br /><input onfocus="test()"/><div style="background-color: red;" onmouseover="test()" onmouseout="test()">aaa</div><input onchange="test()"/></body>
</html>HTML_DOM对象
DOM 我们现在通过html标签事件触发JavaScript函数了，需要在JavaScript函数对网页的标签进行操作。 JavaScript认为网页中的每个标签都是一个对象，在js中把这一类标签对象称为html dom对象
如何在JavaScript中获取网页中的标签对象？ 在网页加载完毕后，在js中生成一个document对象（表示整个html文档，里面提供了一个方法getlementById();
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><script>/* DOM我们现在通过html标签事件触发JavaScript函数了需要在JavaScript函数对网页的标签进行操作。JavaScript认为网页中的每个标签都是一个对象，在js中把这一类标签对象称为html dom对象如何在JavaScript中获取网页中的标签对象？在网页加载完毕后，在js中生成一个document对象（表示整个html文档）里面提供了一个方法getlementById();*/function test(){var tobj1 = document.getElementById("txt1");//通过标签id获取网页中的标签对象var tobj2 = document.getElementById("txt2");tobj2.value =tobj1.value;tobj1.value="";}</script></head><body><input type="text" id="txt1" value=""/><input type="text" id="txt2" value=""/><input type="button" onclick="test()" value="测试"/></body>
</html><!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><script>function test(){var divobj1=document.getElementById("p1");var divobj2=document.getElementById("box1");//innerText 获取标签体中的文本内容//innerHTML 获取标签体中的所有内容(包括子标题和文本)//divobj2.innerText=divobj1.innerText;divobj2.innerHTML=divobj1.innerHTML;}</script></head><body><p id="p1">qqqq</p><div id="box1"><b>html dom对象</b></div><div><input type="button" onclick="test()" value="测试"/></div></body>
</html><!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><script>function test(){var divobj =document.getElementById("box1");//通过dom对象操作标签的css属性divobj.style.backgroundColor='green';divobj.style.width='200px';divobj.style.height='200px';}</script></head><body><p>pppp</p><div id="box1"><b>html dom对象</b></div><div><input type="button" onclick="test()" value="测试"/></div></body>
</html>
