window椿息,所有全局變量都是它的屬性歹袁,所有全局的函數(shù)都是它的函數(shù)。
var age = 18;
console.log(age);
console.log(window.age + '------');
function sum(){
var age = 18;
console.log(age);
}
sum();
window.sum();
console.log('000000');
window.console.log('111111');
動態(tài)跳轉(zhuǎn)
window.location.;
location.;
document,動態(tài)獲取網(wǎng)頁中的所有的節(jié)點寝优,可以動態(tài)的對節(jié)點進行增刪改查条舔。
document.write('hello world');
document.write('<button>百度一下</button>');
document.write('img src="https:www.baidu.com/img/bg_logo1.png" width="200">');
動態(tài)修改圖片
<script>
getElementById id名
getElementsByClassName className
getElementsByName 根據(jù)標簽的內(nèi)部屬性name
getElementsByTagName
function change(){
var img = document.getElementsByName('test2')[0];
img.src = 'img/img_02.jpg';
}
</script>
<body>

<p></p>
<button onclick = "change();">改變圖片</button>
<div class="test1"></div>
</body>
動態(tài)切換圖片
<body>
<img src = 'img/img_01.jpg'>
<p></p>
<button name="btns">切換圖片</button>
<script>
var img = document.getElementsByTagName('img')[0];
var btn = document.getElementsByName('btns')[0];
btn.onclick = function(){
//lastIndexOf('img_01.jpg')如果有,任一正數(shù)乏矾,如果沒有孟抗,返回-1
if(img.src.lastIndexOf('img_01.jpg') != -1){
img.src = 'img/img_02.jpg';
}
else{
img.src = 'img/img_01.jpg';
}
}
</script>
</body>
鼠標移動
<body>
<img src = 'img/img_01.jpg'>
<input>
<script>
var img = document.getElementsByTagName('img')[0];
img.onmousemove = function(){
console.log(‘在圖片上移動’);
}
img.onmouseover = function(){
console.log('進入圖片')钻心;
}
img.onmouseout = function(){
console.log('移出圖片')凄硼;
}
var input = document.getElementsByTagName('input')[0];
input.onfocus = function(){
input.style.outline = 'none';
input.style.width = '300px';
input.style.heigtht = '400px';
}
input.onselect = function(){
alert(input.value);
}
</script>
</body>
顯示隱藏圖片交替
<body>
<img id = 'icon' src = 'img/img_01.jpg'>
<p id = 'word'>helloworld!</p>
<button id = 'btn'>隱藏</button>
<script>
var img = document.getElementById('icon');
var p = document.getElementById('word');
var btn = documentlgetElementById('btn');
btn.onclick = function(){
if(btn.innerHTML == '隱藏'){
btn.innerHTML = '顯示';
img.style.display = ‘none’;
p.style.display = 'none';
}else
{
btn.innerHTML = '隱藏';
img.style.display = 'inline-block';
p.style.display = 'block';
}
}
</script>
</body>
最后編輯于 :2017.12.08 23:58:03
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者