更改屬性
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
window.onload=function () {
document.getElementById("bd").title="去去去";
var link1=document.getElementById("link1")
link1.title="去百度"; //將title屬性更改
link1.; //將href屬性重新修改
}
</script>
</head>
<body>
<a title="來來來" id="bd" name="bd">百度</a>
<a id="link1">啦啦啦</a>
</body>
</html>
設置style
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript">
window.onload=function () {
var q=document.getElementById("div1")
q.style.color="red"
q.style.background="green" //沒有變量時直接用點
q.style.fontSize="200px"
attr="fontSize"
q.style[attr]="50px" //有變量寫在中括號里
alert(q.innerHTML)
alert(q.innerText)
}
</script>
</head>
<body>
<div id="div1">666</div>
</body>
</html>
匿名函數(shù)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
window.onload=function () {
var s=document.getElementById("box");
s.onclick=function () { //可以在設置功能時不寫函數(shù)名直接在function(){}中寫出功能宫莱。
alert('ok')
}
var s1=document.getElementById('box');
function bianliang(sty1,val) { //向函數(shù)中傳遞2個變量時下面的變化如下所示:
s1.style[sty1]=val;
}
bianliang('color','red');
bianliang('background','green');
}
</script>
</head>
<body>
<div id="box">11</div>
</body>
</html>
return 可以設置變量接收返回的結果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
window.onload=function () {
o=document.getElementById("one");
t=document.getElementById('two');
b=document.getElementById('btn1');
function add(a,b){
c=parseInt(a)+parseInt(b)
return c
}
b.onclick=function(){
val1=o.value;
val2=t.value;
var result=add(val1,val2) //接收函數(shù)返回的結果
alert(result)
}
}
</script>
</head>
<body>
<input type="text" id="one">
<input type="text" id="two">
<input type="button" id="btn1" value="相加">
</body>
</html>
if else
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
.box{
width: 100px;
background-color: #d86aff;
height: 100px;
}
</style>
<script type="text/javascript">
//if -----else
window.onload=function () {
var box=document.getElementById('box');
var btn=document.getElementById('btn1');
alert(box.style.display)
btn.onclick=function () {
if(box.style.display=='none'){
box.style.display='block'
} else {
box.style.display='none'
}
}
}
</script>
</head>
<body>
<input type="button" id="btn1" value="點擊">
<div class="box" id="box"></div>
</body>
</html>
運算符的優(yōu)先級
下表按從最高到最低的優(yōu)先級列出JavaScript運算符。具有相同優(yōu)先級的運算符按從左至右的順序求值昔脯。
image.png