javascript實現簡單查找與替換的方法

2024-05-06 16:23:33

字體：大中小

來源：轉載

供稿：網友

這篇文章主要介紹了javascript實現簡單查找與替換的方法,涉及javascript針對頁面查找與替換的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下

本文實例講述了javascript實現簡單查找與替換的方法。分享給大家供大家參考。具體實現方法如下：

<html>

<head>

<title>中國風</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

</head>

<script language="JavaScript">

var oldStr;

var newStr;

function searchText(str){

// 創建TextRange對象,指定為整個body區域

var myText = document.body.createTextRange();

if(myText.findText(str)){

myText.select();

// 如果找到目標文本,則將其選中

}else{

alert("沒有找到匹配的字符!");

}

}

function getTheText(){

oldStr = prompt("輸入要查找的內容","");

// 獲取用戶要查找的內容

if(oldStr!=null){

// 如果內容不為空,則執行查找

searchText(oldStr);

}

}

function replaceText(){

if(oldStr==null){

alert("請先進行查找要替換的內容!");

}else{

newStr = prompt("替換為","");

if(newStr!=null){

// 新文本內容不為空,則替換選中的文本

var selectText = document.selection.createRange();

// 選中的文本

selectText.text = newStr;

// 替換選中的文本為新文本

}else{

alert("請輸入替換的內容!");

}

}

}

</script>

<body>

<input type="button" value="查找" onclick="getTheText()">

<input type="button" value="替換" onclick="replaceText()">

<pre id="pre">

石壕吏

暮投石壕村，有吏夜捉人。

老翁逾墻走，老婦出門看。

吏呼一何怒！婦啼一何苦！

聽婦前致詞：三男鄴城戍（shù）。

一男附書至，二男新戰死。

存者且偷生，死者長已矣！

室中更無人，惟有乳下孫。

有孫母未去，出入無完裙。

老嫗力雖衰，請從吏夜歸。

急應河陽役，猶得備晨炊。

夜久語聲絕，如聞泣幽咽（yè）。

天明登前途，獨與老翁別。

</pre>

</body>

</html>