<html>
<head>
<title>javaScript</title>
<!--JS简介
JavaScript 是一门广泛应用于web前端的脚本语言。它是解析型的语言，无需编译，
边解释边执行。
JS的常见书写方式有两种，一种是在html中嵌套，另一种是在html中引用js文件。
<html>
<head>
<script type="text/javascript"></script>//第一种方式
<script src="thisScript.js"></script>//第二种方式
<head>
</html>
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
-->
<style>
<!--style里面可以写css-->
</style>
<script type="text/javascript">
/* javaScript（脚本语言，没办法独立运行，必须依赖于其他语言）
和java没有半毛钱关系
JavaScript不区分数据类型，其中全部都是弱类型变量（var类型，全称变量variables）;
*/
var age = 18;
alert(age); //将会在页面显示一个提示框，并显示其中的内容
alert(age+"-age变量的数据类型是："+typeof(age)); //------number
var age2='18';
alert(age2+"-age变量的数据类型是："+typeof(age2));//-----String
var age3=new Object();
alert(age3+"-age变量的数据类型是："+typeof(age3));//-----object
var age4=null;
alert(age4+"-age变量的数据类型是："+typeof(age4));//age4的值是空，但是类型是Object
var age5;
alert(age5+"-age变量的数据类型是："+typeof(age5));//undefined--数据类型是undefined（未定义）
if(true){
alert("join if"); //js中的判断和java中的一样
}
if(1){
alert("join if");//在js中，1和true是等价的，0和false是等价的。
}
var v1=18;
var v2='18';
alert((v1==v2)+'--'+(v1===v2)); /*"=="运算符当两个数据的类型不同时，
将自动转换为相同类型，并比较内容。
"==="运算符是当两个数据的类型不同时，
只有内容和类型都一至时，才是true。*/
switch('1'){ //在等值判断时，无法进行转换类型,当为1时，无法进入判断。
case '1':alert(1); break;
case '2':alert(2);break;
case '3':alert(3);break;
}
while(false){
alert("while__true");/*定义数据的时候其实是指定了数据类型的，只不过
引用的类型是var类型，当数据被调用时，
系统会自动将数据的源态传入进去。*/
}
for(var i=0;i<5;i++){
alert("i的值为"+i);
}
var arr=['111111','222222222','3333333']; //arr的类型是Object
for(var i in arr){//这里的增强for的语法和操作和java是不同的。
alert("i的类型是"+typeof(arr[i])+"--"+arr[i]);
}
//js中的数组
var arr1=new Array();
alert(arr1+"-类型"+typeof(arr1));
var arr2=new Array(13); //页面中显示的点数和数字有关。
alert(arr2+"-类型"+typeof(arr2));
var arr3=new Array(['111','222']);
alert(arr3+"-类型"+typeof(arr3));
var arr4=['11','22','33'];
var arr5=new Array();
arr5.push('zhang');
arr5.push('qiao');//push()方法，向数组中存放数据。
alert("经历push后的数组"+arr5+":"+arr5.length);
//1.一些简单的命令
alert("提示框"); //警报
confirm("确认框"); //确认
prompt("弹出一个输入框"); //提词，提示;
//文档的对象
document.write("文档书写");
console.log("在控制台打印信息");
console.dir("在控制台打印对象的所有信息");
//2.函数function
/*函数命名：和java方法的命名方式一样，但是在JS中不可以有同名的
函数因为后面的重名方法会把前面的方法覆盖掉。
函数返回值：当函数执行完毕后，得到的结果就是一个返回值。
任何函数都有返回值。
*/
//函数声明
function login(a,b){//参数可以传多也可以传少。
alert("a："+a+"b:"+b);
//构建数组对象用来返回多个结果值，js的数组里什么都可以放。
var arr=new Array();
a++;
arr.push(a);
arr.push(b);
return arr;
}
function f1(){
alert("join f1 function");
}
window.alert(login(1,2));//显示代码内容，和显示代码结果。
/*能否实现自定义类
这里和java是非常相似的，但是js中没有类的概念，所以
function函数就可以看作构造方法。
*/
//相当于构造方法
function Person(age,name){
//this代表当前的function对象。
this.age=age;
this.name=name;
}
var person = new Person(18,'qiaotao');
alert(person+"-person的类型-"+typeof(person));
alert(person.age+"--"+person.name);
//定义匿名函数
window.onload=function(){
alert('只用一次的方法');
}
var aa=function(){}//函数对象
window.onload=aa; //相当于赋值操作。
window.onload=aa();//调用函数
</script
</head>
<body>
<button onclick="alert('你点我干嘛');">点我一下</button><!--竟然不能是双引号
双引号会和外部的引号冲突。
-->
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<!--我们来做一些简单的练习-->
<script type="text/javascript">
function changeImage(){
element=document.getElementById('myimage')
if (element.src.match("bulbon")){
element.src="/images/pic_bulboff.gif";
}
else{
element.src="/images/pic_bulbon.gif";
}
}
function myFunction(){
x=document.getElementById("demo"); // 找到元素
x.innerHTML="Hello JavaScript!"; // 改变内容
}
//JS中的对象也是一个变量，只是这个变量可以包含多个值。
var car = {type:"Fiat", model:500, color:"white"};
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
//可以通过对象.属性的方式来访问属性。
window.alert(person.lastName);
//函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
function functionName(){
//执行代码
}
/*当有参数的函数调用时，如果传的实参多，则后面的参数会丢失，
如果传的参数少，那么最后的参数会未被定义。*/
/*当我们要使用函数的返回值时，需要在方法中return 要返回的变量，
如果变量较多，要把变量都放到数组中，在返回数组，js中的数组可以放任何
东西。并且函数声明，只能是下面的格式，有关键字和函数名组成。
function functionName(){
//执行代码
}*/
/*
*/
</script>
</head>
<body>
<!--
一.JavaScript可以通过不同的方式来输出数据：
使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。
二.常见的HTML事件:
onchange HTML 元素改变
onclick 用户点击 HTML 元素
onmouseover 用户在一个HTML元素上移动鼠标
onmouseout 用户从一个HTML元素上移开鼠标
onkeydown 用户按下键盘按键
onload 浏览器已完成页面的加载
-->
<img id="myimage" onclick="changeImage()" src="/images/pic_bulboff.gif" width="100" height="180">
<p>点击灯泡就可以打开或关闭这盏灯</p>
<h1>我的第一段 JavaScript</h1>
<p id="demo">JavaScript 能改变 HTML 元素的内容。</p>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>
js和java很多都是都是相似的。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
