JavaScript总结
1.什么是JavaScript
2.JS的特点和劣势
3.在html中书写JS代码
4.JS的根本数据类型
5.JS的变量申明
6.JS中的循环语句根本和JAVA相似
7.JS申明数组
8.JS函数
9.DOM操作
1.什么是JavaScript
- JavaScript是一中内嵌在浏览器中运行的脚本语言,简称JS。
- JS在浏览器中运行,实现浏览器中的动画成果;或者实现提交表单的校验等性能.
-
- *
2.JS的特点和劣势
- 特点:
(1)JS是一门直译式的语言,即一边解释一边执行,不须要编译。
java–>编写时xxx.java–>jVM编译为xxx.class–>运行class文件。
js–>编写时xxx.html文件,编写时js文件,间接运行。
(2)JS是一门基于对象的语言;JS中没有类的概念。
(3)jS是一门弱对象语言。
//在java中,变量一旦被申明,变量的类型就不变了。
String a = "aaa";
int b = 10;
//在JS中不同
var c = "ccc";
c = true;
c = 123;
c = [];
c = function (){};
c = //;
...
- 劣势:
(1)JS有良好的交互性(可能就是人机交互体验比拟好吧,从电脑输出代码后,通过浏览器很好的展现在界面上)
(2)JS安全性较好,因为只能在浏览器外部运行,不能拜访浏览器之外的资源。
(3)JS具备跨平台性。因为JS只能在浏览器上运行,所有只有有浏览器,都能被执行。
3.在html中书写JS代码
- (1)能够在
<head>
或者<body>
中增加一个<script type="text/javascript">
标签。
<script type="text/javascript">
//JS的单行正文
/* JS的多行正文 */
alert( "在html中引入JS的第一种形式..." );//alert在浏览器上弹出一个窗口
</script>
- (2)通过
<script>
标签引入内部JS文件。
<script src="JS文件门路"/> //自闭的是因为<script>中的代码不会被执行
- (3)也能够间接将代码写在标签中。
-
- *
4.JS的根本数据类型
- (1)数值类型
*在JS中所有的数值类型底层都是浮点类型,然而在解决和显示过程中,会主动切换整型。
*非凡值:Infinity无穷大/-Infinity负无穷大/NaN非数字 - (2)布尔类型
*true/false - (3)字符串类型
var s1 = 's1';
var s2 = "s2"; // 简略数据类型 , String
var s3 = new String("s3");//简单数据类型,Object
- (4)undefined类型
*只变量只定义,但没有赋值
var ss;
alert(ss); //undefined
alert(zz); //抛异样
- (5)null类型
*能够作为函数的返回值,示意此函数的返回值为空。 - (6)简单数据类型
*次要指对象(JS的内置对象、自定义的对象、函数、数组等) - undefined和null不能调用函数或属性。
5.JS的变量申明
js通过var申明变量:
var a = 1;
a = "abc";
a = [];
a = {};
a = new Object();
a = function(){};
6.JS中的循环语句根本和JAVA相似
7.JS申明数组
- 数组中能够传入任何类型的值,并且数组的长度能够任意扭转。
形式1:
//申明一个空数组
var ar = [];
//申明数组并赋值
var ar = [123, "ahhah", true, false, new Object];
形式2:
var ar = new Array();
var ar = new Array(123, "ahhah", true, false, new Object);
8.JS函数
- JS函数格局:
funcrion([参数]){
//函数体
}
//或者
var 函数名 = function([参数列表]){
//函数体
}
9.DOM操作
- DOM(Document Object Model),文档对象模型;是JS拜访html元素提供的一套API。
- document是一个js对象,用于示意以后html网页。当浏览器加载实现,会用document来示意整个html网页对象。
// 依据标签id返回一个标签,返回的是一个js对象
// 返回一个id为img1的图片标签
var oImg = document.getElementById("img1");
// 通过获取的js对象能够操作标签中属性的值
oImg.src="";//设置图片标签的图片门路
- 增删改元素
// 增删改元素
//1.减少一个div元素到body中
function(){
// 创立一个div
var oDiv = document.createElement("div");
oDiv.innerHTML = "div中的内容";// 在div中插入内容
var oBody = document.body; // 获取body元素
oBody.appendChild(oDiv); //将div增加到body中
}
// 删除id为id2的元素
function(){
//1.获取id为id2的元素
var oId2 = document.getElementById("id2");
//2.获取id2元素的父类元素
var id2_fa = oId2.parentNode;
//3.通过父类元素删除子类元素
id2_fa.removeChild(oId2);
}
// 更新div_3中的内容为以后工夫
function(){
//1.获取div_3
var d3 = document.getElementById("div_3");
//2.获取以后工夫
var now_Date = new Date().toLocaleString();
//3.插入工夫
d3.innerHTML = now_Date;
}
发表回复