JavaScript基础教程-优快云博客

本文链接：https://blog.youkuaiyun.com/skate6/article/details/46832095

1.换行反斜杠\
2.y=123e5 //12300000
x=123e-5 //0.00123
3.数组
var cars=new Array();
cars[0]="Audi";
cars[1]="BMW";
cars[2]="Volvo";

var cars=new Array("Audi","BMW","Volvo");

var cars=["Audi","BMW","Volvo"];
4.对象
var person={firstname:"Bill", lastname:"Gates", id:5566};

对象属性寻址方式：
name=person.lastname;
name=person["lastname"];

4.1属性和方法
car.name=Fiat
car.start()
4.2
var txt = "Hello";
txt.length=5
txt.indexOf()
txt.toUpperCase();
txt.replace()

txt.search()
4.3
person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";
document.write(person.firstname + " is " + person.age + " years old.");

5.Undefined 和 Null
var person;
var car="Volvo";
var house=null

6.声明变量类型
关键词 "new" 来声明其类型：
var carname=new String;
var x=      new Number;
var y=      new Boolean;
var cars=   new Array;
var person= new Object;

7.function 传参
<button οnclick="myFunction('Bill Gates','CEO')">点击这里</button>

7.1 function return
function myFunction()
{
var x=5;
return x;
}
function myFunction(a,b)
{
if (a>b)
{
return;
}
x=a+b
}

8 document.getElementById
document.getElementById("demo").innerHTML=myFunction();
document.getElementById("demo").innerHTML=myFunction(4,3);

9.JavaScript 变量的生存期

JavaScript 变量的生命期从它们被声明的时间开始。

局部变量会在函数运行以后被删除。

全局变量会在页面关闭后被删除。

值赋给尚未声明的变量，该变量将被自动作为全局变量声明.即使它在函数内执行。

10.运算符
10.1
string 相加
txt1="What a very";
txt2="nice day";
txt3=txt1+" "+txt2;

10.2 比较
== 等于 x==8 为 false
=== 全等（值和类型） x===5 为 true；x==="5" 为 false

10.3逻辑运算符
&& and (x < 10 && y > 1) 为 true
|| or (x==5 || y==5) 为 false
! not !(x==y) 为 true

10.4三目表达式
greeting=(visitor=="PRES")?"Dear President ":"Dear ";

11 try catch throw
<body>

<h1>我的第一个 JavaScript 程序</h1>
<p>请输入 5 到 10 之间的数字：</p>
<input id="demo" type="text">
<button type="button" οnclick="myFunction()">测试输入值</button>
<p id="mess"></p>

</body>

11.E-mail 验证

<html>
<head>
<script type="text/javascript">
function validate_email(field,alerttxt)
{
with (field)
{
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2)
{alert(alerttxt);return false}
else {return true}
}
}

function validate_form(thisform)
{
with (thisform)
{
if (validate_email(email,"Not a valid e-mail address!")==false)
{email.focus();return false}
}
}
</script>
</head>

<body>
<form action="submitpage.htm"οnsubmit="return validate_form(this);" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>
</html>

13.改变 HTML 属性
document.getElementById(id).attribute=new value
<img id="image" src="smiley.gif">
<script>
document.getElementById("image").src="landscape.jpg";
</script>

14.改变 HTML 样式
document.getElementById(id).style.property=new style
<script>
document.getElementById("p2").style.color="blue";
</script>
HTML DOM Style 对象参考手册
http://www.w3school.com.cn/jsref/dom_obj_style.asp

15，onload事件
onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本。处理 cookie。
Navigator 对象包含有关浏览器的信息。

onmouseover 和 onmouseout 事件onfocus

<div οnmοuseοver="mOver(this)" οnmοuseοut="mOut(this)" style="background-color:green;width:120px;height:20px;padding:40px;color:#ffffff;">把鼠标移到上面</div>

function mOut(obj)
{
obj.innerHTML="把鼠标移到上面"
}
</script>

15.juery 添加新元素
var txt1="<b>I </b>"; // 以 HTML 创建新元素
var txt2=$("<i></i>").text("love "); // 通过 jQuery 创建新元素
var txt3=document.createElement("big"); // 通过 DOM 创建新元素
txt3.innerHTML="jQuery!";
$("img").after(txt1,txt2,txt3);

16. 换行样式

style='word-wrap:break-word;white-space:normal;width:400px;border:1px'

document.getElementById("finalPrice").setAttribute("readonly", "true");

document.getElementById("housesearch").disabled = true;

document.getElementById("buttondiv").style.display = "none";