Div 文字的取得和取代 + 滑鼠提示


不太願去找露比大人,所以就寫下了這個小玩意,滑鼠提示是個簡單的東西,因為朋友問我,又寫的,雖然不是過於完善,但總算做到了基本的東西
而 Div 文字取得,這個可能會在將來日子有用吧,因為這樣可以省去了用 PHP 之後的分析,只要將一填資料存入陣列之後再呼叫就可以將整個區塊的文字自動取代成粗體,這個應該是不錯的方法吧..

本想將兩個整合在一起,不過太累了..到此為止吧 !

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<html>
<head>
<meta http-equiv=content-type content="text/html; charset=UTF-8">
<title>This is a test</title>
<style type="text/css">
body { font-size: 12px; }
#tipsDiv { display: none; padding: 3px; font-size: 12px; z-index: 1000; }
</style>
<script language="javascript">
function myTips(event, tips) {
if (event == "") {
document.getElementById('tipsDiv').style.display = 'none';
}else{
document.getElementById('tipsDiv').style.display = 'block';
document.getElementById('tipsDiv').innerHTML = tips;
document.getElementById('tipsDiv').style.left = event.clientX - 10;
document.getElementById('tipsDiv').style.top = event.clientY + 20;
document.getElementById('tipsDiv').style.position = 'absolute';
document.getElementById('tipsDiv').style.background = '#FFFF99';
}
}
function myBold() {
message = document.getElementById('message').firstChild.nodeValue;
keyword = document.getElementById('keyword').value.split(',');

for(i=0;i<keyword.length;i++) {
var reg= new RegExp("("+keyword[i]+")","g");
message = message.replace(reg,"<b>$1</b>");
}

document.getElementById('message').innerHTML = message;
}
</script>
</head>
<body>
<div id="tipsDiv"></div>
<hr />
<a href="" onmouseover="myTips(event,'Home')" onmouseout="myTips('')">首頁</a><br /><br />
<a href="" onmouseover="myTips(event,'Me')" onmouseout="myTips('')">簡介</a><br /><br />
<a href="" onmouseover="myTips(event,'About')" onmouseout="myTips('')">關於</a><br /><br />
<hr />
<div id="boldbtn">
<input type="keyword" value="寫,code,可以" id="keyword" />
<input type="button" value="變粗文字" onclick="myBold()" />
</div>
<hr />
<div id="message">我寫了一段code想讓鼠標移到某些字時讓div tag出現在該字的下方在IE裡可以跑了,而在 FF 好像也正常了..都算是不錯了?</div>
</body>
</html>