js中事件的處理與瀏覽器對象示例介紹

2024-05-06 15:56:29

字體：大中小

來源：轉載

供稿：網友

本文為大家詳細介紹下js中關于簡單事件的處理與瀏覽器對象，下面有個不錯的示例，感興趣的朋友可以參考下

復制代碼代碼如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>簡單的事件處理</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">


<script type="text/javascript">
function clickD(obj){
alert(obj.innerHTML);
}

function mouseD(obj){
obj.style.color = "#f00";
//當使用代碼來設置樣式時，如果css中通過-來表示的，都必須要用駝峰標示font-size -> fontSize
obj.style.fontSize = "16px";
}
function outD(obj){
obj.style.color = "#000";
obj.style.fontSize = "18px";
}

//with的用法
with(document){
write("dddd<br/>");
}
document.write("aaaa<br/>");
document.write("bbbb<br/>");
document.write("cccc<br/>");
</script>
</head>

<body>
<div>點擊了試一下</div>
<div>鼠標移動來試試</div>

</body>
</html>

2，瀏覽器對象的例子：《涉及的是兩個瀏覽器頁面之間的傳值》

復制代碼代碼如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js01_hello</title>
<meta content="Administrator" />
<script type="text/javascript">
// setTimeout("endWelcome()",5000);
// function endWelcome() {
// document.getElementById("welcome").style.display = "none";
// }
</script>
</head>
<body>
<div>歡迎進行我們的網站</div>
<a href="#">test02</a>
<a href="#">test03</a>
<br/>
<a href="#">輸入你祝福語</a>
<a href="#">選擇性別</a>
<div></div>
</body>
</html>

復制代碼代碼如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js01_hello</title>
<meta content="Administrator" />
<script type="text/javascript">
function bless() {
//獲取輸入的祝福語
var mb = document.getElementById("mb").value;
//獲取父類窗口
var p = window.opener;
//獲取父類窗口中的id為bless的div
var pd = p.document.getElementById("bless");
//設置pd的值
pd.innerHTML = mb;
//關閉當前窗口
window.close();
}
</script>
</head>
<body>
輸入祝福語:<input type="text" size="40"/><input type="button" value="輸入" />
</body>
</html>