資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何使用 JavaScript 替換文件內容？
在本教程中，我們將學習如何使用 JavaScript 替換 HTML 文件的內容。在 JavaScript 中，我們可以結合以下方法更改 HTML 文件的內容：
open - open 方法用於開啟一個新文件，它接受兩個引數 text/html 和 replace，其中第一個引數將定義要形成的新文件的型別，第二個引數將替換所有新增到上一個頁面上的歷史記錄，並有助於輕鬆開啟新文件。
document.open("text/html", "replace");
write - 使用 open() 方法建立新文件後，您需要使用 write() 方法，該方法接受新文件的內容，並且您可以傳遞與 HTML 標籤關聯的新文件的內容，如下所示：
document.write("content of new document");
close - close() 方法用於使新文件生效，如下面的語法所示：
document.close();
讓我們藉助程式碼示例瞭解所有這些方法的實際實現。
演算法
步驟 1 - 在第一步中，我們將在 HTML 文件中定義一個帶有 onclick 事件的按鈕標籤，稍後在單擊該按鈕時，它將用新文件替換文件。
步驟 2 - 在此步驟中，我們將為上一步中定義的按鈕分配的 onclick 事件定義回撥函式。
步驟 3 - 在最後一步中，我們將根據每個方法關聯的語法，使用上述方法在回撥函式內編寫邏輯，以替換 HTML 文件的內容。
示例 1
以下示例將用段落標籤內的一行內容替換 HTML 文件的內容：
<!DOCTYPE html>
<html>
<body>
<p>Click and replace this content. </p>
<button onclick = "Display()">Replace</button>
<script>
function Display() {
document.open( "text/html", "replace");
document.write( " <p> This is the replaced content inside paragraph tag only. </p> ");
document.close();
}
</script>
</body>
</html>
在上面的示例中，我們在與段落標籤關聯的 write 文件內只使用了一行內容，這將用段落標籤內的該文字替換整個先前 HTML 文件的內容。
讓我們看另一個示例，其中我們將用一些複雜文字替換現有 HTML 文件的內容。
演算法 - 此示例的演算法與上一個示例幾乎相同，您只需要將所有新的 HTML 內容聚合到一個字串變數中，透過該變數您可以替換現有文件的內容。
示例 2
以下示例將向您解釋如何使用上述三種方法用一些複雜的 HTML 文字替換現有文件的內容：
<!DOCTYPE html>
<html>
<body>
<p>Click and replace this content.</p>
<button onclick = "Display()">Replace</button>
<script>
var newText = " <h4> This is the new document text </h4>" + " <p> This is the replaced text </p> ";
function Display() {
document.open("text/html", "replace");
document.write(newText);
document.close();
}
</script>
</body>
</html>
在上面的示例中，我們使用了相同的三種方法來替換 HTML 文件的內容，但是這次我們將新 HTML 文件的複雜 HTML 內容儲存在一個字串變數中，然後將其傳遞給 write() 方法，該方法隨後將當前文件的內容替換為變數中的內容。
在本教程中，我們已經瞭解瞭如何使用 JavaScript 的 open()、write() 和 close() 方法，透過實際實現並藉助三個不同的程式碼示例在不同情況下了解其用法，用一些新內容更改現有 HTML 文件的內容。
3K+ 次檢視
