JavaScript介绍
JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
内容
JavaScript基本语法
JavaScript对象获取
JavaScript获取标签内容
JavaScript操作标签属性
JavaScript事件绑定
JavaScript(简称JS)引入方式
第一种
直接写在网页内部,body内可以,head中也可以
<script>
alert("hello");//警告框
confirm("确定删除吗?");//确认框
prompt("请输入分数",100);//带有输入框的确认框
console.log("这是控制台输出");
</script>
第二种:引入外部js
<script type="text/javascript" src="js/myjs.js" ></script>
不能在引用外部js的标签中写自己的js代码,比如说上面一行中,引入其他JS文件,那么不能在两个标签内写其他内容。
也不能直接使用script单个标签引入没有后面的结束标签,否则无法引用到。
例如:
<script type="text/javascript" src="js/myjs.js" /> 这样会导致引用失败
JS语法
Js当中所有变量的修饰统一使用var
var score=80;
var name=”张三”;
变量的命名规则:包括字母、下划线、$、数字,但是不能以数字开头
var s=100;
var name=“admin”;
alert(name);
数据类型
Number:数字类型
String: 字符串
Boolean:布尔类型
Undefined:未定义
Null:空
Undefined 从null发展而来的,如果alert(undefined==null)
<script type="text/javascript">
var num=19;
var str="admin";
var i=true;
var s;
var d=null;
alert(typeof i);
</script>
运算符和 C, Java等几乎一致,其实大部分语言都是统一的,需要注意的是JS使用 === 和 ==表示判断两个值的相等,都是可以的,建议使用 === 严格判断
获取某一元素的方法
document.getElementbyId(); 根据id去查找元素
Document.write(); 在文档中写入元素
案例
手动验证内容不能为空
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title> <!--Javascript-->
<script type="text/javascript">
function check(){
var a1 = document.getElementById("name").value
if(a1==""){
alert("name can't be null")
return false
}
var a2 = document.getElementById("psw").value
if(a2==""){
alert("password can't be null")
return false
}
var a3 = document.getElementById("email").value
var reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/
if(!reg.test(a3)){
alert("email format not right")
return false
}
return true
}
</script>
</head> <!--外部样式和JS引用 外部文件不需要写外部的框-->
<body>
<!--<script type="text/javascript" src="js/js1.js" ></script> -->
<!--外部引用中间不写东西-->
<!--onsubmit 提交时触发事件-->
<form action="http://baidu.com" method="get" onsubmit="return check()">
<table border="0px">
<tr>
<td>UserName</td>
<td><input id="name" type="text" ></td>
</tr>
<tr>
<td>Password</td>
<td><input id="psw" type="password"></td>
</tr>
<tr>
<td>Email</td>
<td><input id="email" type="email"></td>
</tr>
<tr>
<!--也可以在这里加入onclick+有返回值的方法-->
<td><input type="submit" value="submit"></td>
<td><input type="reset" value="reset"></td>
</tr>
</table>
</form>
</body>
</html>