使用手冊取消

在設計檢視中編輯程式碼

搜尋

上次更新時間 2021年4月29日

Dreamweaver

開啟應用程式

使用此主題，了解如何使用屬性檢視窗，在 Adobe Dreamweaver 的設計檢視中編輯程式碼。

Dreamweaver 可讓您以視覺方式建立並編輯網頁，而不必擔心基礎原始碼，但有時可能必須編輯程式碼，以取得更大控制或進行網頁疑難排解。Dreamweaver 可讓您在設計檢視中工作時編輯一些程式碼。

本節是專為喜歡在「設計」檢視中工作、同時又希望能夠快速存取程式碼的人而設計的。

在設計檢視中選取子標籤

如果您在「設計」檢視中選取包含子標籤的物件 (例如 HTML 表格)，您可以利用選取「編輯 > 選取子項目」快速選取該物件第一個子標籤。

註解：

這個命令只可以在「設計」檢視中啟用。

舉例來說，<table> 標籤通常包含 <tr> 子標籤。如果您在標籤選取器中選取 <table> 標籤，您可以利用選取「編輯 > 選取子項目」來選取該表格的第一列。Dreamweaver 會選取標籤選取器中的第一個 <tr> 標籤。由於 <tr> 標籤本身就有名為 <td> 的子標籤，再一次選取「編輯 > 選取子項目」就會選取表格的第一個儲存格。

使用屬性檢視窗編輯程式碼

您可以使用「屬性」檢視窗來檢查和編輯頁面上文字或物件的屬性。「屬性」檢視窗中所顯示的屬性，通常是對應到標籤的屬性；在「屬性」檢視窗中變更屬性，與在「程式碼」檢視中變更相對應的屬性，效果通常是相同的。

註解：

「標籤」檢視窗和「屬性」檢視窗都能讓您檢視和編輯標籤的屬性。「標籤」檢視窗可讓您檢視並編輯與特定標籤有關聯的各項屬性。「屬性」檢視窗雖然只會顯示最常用的屬性，但是會提供一組更完整的控制項，用來變更這些屬性的值，讓您能夠編輯並未對應到特定標籤的特定物件 (例如表格欄)。

在文字中按一下，或選取頁面上的物件。

該文字或物件的「屬性」檢視窗就會出現在「文件」視窗下面。如果看不見「屬性」檢視窗，請選取「視窗 > 屬性」。
在「屬性」檢視窗中變更屬性。

使用屬性檢視窗編輯 CFML

使用「屬性」檢視窗來檢查和修改「設計」檢視中的 ColdFusion 標記。

在「屬性」檢視窗中，請按一下「屬性」按鈕以編輯標籤的屬性或新增屬性。
如果在標籤的開頭和結束標籤間已有內容，請按一下「內容」按鈕來編輯它。

選取的標籤必須不是空白標籤 (必須同時具有開頭和結束標籤)，「內容」按鈕才會出現。
如果標籤含有條件運算式，請在「運算式」方塊中進行變更。

快速標籤編輯器總覽

您可以使用「快速標籤編輯器」快速檢查、插入和編輯 HTML 標籤，而不需離開「設計」檢視。

若在快速標籤編輯器中輸入無效的 HTML，Dreamweaver 會視需要插入右引號和右角括號，嘗試加以改正。

若要設定「快速標籤編輯器」選項，請按 Control+T 鍵 (Windows) 或 Command+T 鍵 (Macintosh) 以開啟「快速標籤編輯器」。

「快速標籤編輯器」有三種模式：

「插入 HTML」模式是用來插入新的 HTML 程式碼。
「編輯標籤」模式是用來編輯現有的標籤。

「插入 HTML」模式是用來插入新的 HTML 程式碼。
「編輯標籤」模式是用來編輯現有的標籤。
「用標籤圍繞」模式是用新標籤圍繞目前的選取範圍。

註解：

開啟「快速標籤編輯器」的模式是由「設計」檢視中的目前選取範圍決定。

在這三種模式中，使用「快速標籤編輯器」的基本程序都是一樣的：開啟編輯器、輸入或編輯標籤和屬性，然後關閉編輯器。

您可以在「快速標籤編輯器」開啟時按 Control+T 鍵 (Windows) 或 Command+T 鍵 (Macintosh)，依序切換不同模式。

使用快速標籤編輯器編輯程式碼

使用「快速標籤編輯器」(「編輯 > 快速標籤編輯器」)，快速插入和編輯 HTML 標籤，而不需離開「設計」檢視。

插入 HTML 標籤

在「設計」檢視中，按一下頁面內部，將插入點置於您要插入程式碼的位置。
按 Control+T 鍵 (Windows) 或 Command+T 鍵 (Macintosh)。

「快速標籤編輯器」就會以「插入 HTML」模式開啟。

插入 HTML 模式中的快速標籤編輯器
輸入 HTML 標籤然後按 Enter 鍵。

這個標籤以及對應的結束標籤 (如果適用) 就會插入程式碼中。
按 Escape 鍵結束而不做任何變更。

編輯 HTML 標籤

在「設計」檢視中選取物件。

您也可以從「文件」視窗底部的標籤選取器選取想要編輯的標籤。如需詳細資訊，請參閱使用標籤選取器編輯程式碼。
按 Control+T 鍵 (Windows) 或 Command+T 鍵 (Macintosh)。

「快速標籤編輯器」就會以「編輯標籤」模式開啟。
輸入新屬性、編輯現有屬性，或編輯標籤名稱。
按 Tab 鍵可從一個屬性跳到下一個；按 Shift+Tab 鍵則會往回跳。

註解：

依預設值，當您按 Tab 或 Shift+Tab 鍵時，變更就會套用至文件。
若要關閉「快速標籤編輯器」並套用所有變更，請按 Enter 鍵。
若要結束而不進行任何變更，請按 Escape。

使用 HTML 標籤圍繞目前選取範圍

在「設計」檢視中選取未格式化的文字或物件。

註解：

如果選取了包含開頭或結束 HTML 標籤的文字或物件，「快速標籤編輯器」便會以「編輯標籤」模式開啟，而不是以「用標籤圍繞」模式開啟。
按 Control+T 鍵 (Windows) 或 Command+T 鍵 (Macintosh)，或者按一下「屬性」檢視窗中的「快速標籤編輯器」按鈕。

「快速標籤編輯器」就會以「用標籤圍繞」模式開啟。
輸入單一開啟標籤，例如 strong，然後按 Enter 鍵 (Windows) 或 Return 鍵 (Macintosh)。

這個標籤就會插入到目前選取範圍的開頭，並且在結尾插入對應的結束標籤。
若要結束而不進行任何變更，請按 Escape。

在快速標籤編輯器中使用提示選單

「快速標籤編輯器」包含屬性提示選單，它會列出您要編輯或插入標籤的全部有效屬性。

您也可以在「快速標籤編輯器」中停用提示選單，或調整選單彈出前的延遲時間。

若要查看列出有效標籤屬性的提示選單，在「快速標籤編輯器」中編輯屬性名稱時請稍做停頓。提示選單便會出現，列出您正在編輯之標籤的全部有效屬性。

同樣地，若要查看列出有效標籤名稱的提示選單，請在「快速標籤編輯器」中輸入或編輯標籤名稱時請稍做停頓。

註解：

「快速標籤編輯器」程式碼提示偏好設定是由一般程式碼提示偏好設定所控制。如需詳細資訊，請參閱設定程式碼提示偏好設定。

請執行下列其中一項作業：
- 開始鍵入標籤或屬性名稱。「程式碼提示」選單中的選取範圍會跳至以您所鍵入的字母為開頭的第一個項目。
- 使用向上鍵或向下鍵選取項目。
- 使用捲軸尋找項目。
按 Enter 鍵插入所選取的項目，或按兩下該項目便可插入。
若要關閉提示選單而不插入項目，請按 Escape 或繼續鍵入即可。

停用提示選單或變更它出現前的延遲時間

選取「編輯 > 偏好設定」(Windows) 或「Dreamweaver > 偏好設定」(Macintosh)，然後選取「程式碼提示」。

「程式碼提示偏好設定」對話方塊便會出現。
若要停用提示選單，請取消選取「啟用程式碼提示」選項。

使用標籤選取器編輯程式碼

您可以使用標籤選取器來選取、編輯或移除標籤，而不需離開「設計」檢視。標籤選取器位於「文件」視窗底部的狀態列中，並且會顯示一系列的標籤。

編輯或刪除標籤

在文件中按一下。

套用在插入點的標籤就會出現在標籤選取器中。
在標籤選取器中的標籤上按滑鼠右鍵 (Windows) 或按 Control + 按一下 (Macintosh)。
若要編輯標籤，請從選單選取「編輯標籤」。在「快速標籤編輯器」中進行變更。如需詳細資訊，請參閱使用快速標籤編輯器編輯程式碼。
若要刪除標籤，請從選單選取「移除標籤」。

選取與標籤對應的物件

在文件中按一下。

套用在插入點的標籤就會出現在標籤選取器中。
按一下標籤選取器中的標籤。

便會在頁面上選取標籤所代表的物件。

註解：

請使用這種技巧選取個別表格列 (tr 標籤) 或儲存格 (td 標籤)。

在設計檢視中撰寫和編輯 Script

在「程式碼」和「設計」檢視中都可以使用用戶端 JavaScript 和 VBScript，其方式如下：

撰寫頁面的 JavaScript 或 VBScript Script，而不需離開「設計」檢視。
在文件中建立外部 Script 檔案的連結，而不需離開「設計」檢視。
編輯 Script 而不需離開「設計」檢視。
在開始之前，請選取「檢視 > 視覺輔助 > 隱藏元素」，以確保 Script 標記會出現在頁面中。

撰寫用戶端 Script

將插入點置於您想要插入 Script 的位置。
選取「插入 > HTML > Script」。
在檔案選取視窗中選取 Script。

註解：

您不需要包含開頭和結束 Script 標籤。

所選取檔案的 Script 標籤會插入文件中。

編輯 Script

選取 Script 標記。
在「屬性」檢視窗中，按一下「編輯」按鈕。

Script 便會出現在「Script 屬性」對話方塊中。

如果您連結到外部 Script 檔案，檔案便會在「程式碼」檢視中開啟，您即可在此進行編輯。

註解：

如果在 Script 標籤之間有程式碼，那麼即使也有外部 Script 檔案的連結，「Script 屬性」對話方塊還是會開啟。
在「語言」方塊中，指定 JavaScript 或 VBScript 作為 Script 語言。
在「類型」彈出式選單中，指定 Script 的類型 (用戶端或伺服器端)。
(選擇性) 在「來源」方塊中，指定外部連結的 Script 檔案。

按一下資料夾圖示或「瀏覽」按鈕以選取檔案，或者輸入路徑。
編輯 Script，然後按一下「確定」。

在設計檢視中編輯 ASP 伺服器端 Script

請使用 ASP Script 的「屬性」檢視窗，檢查和修改「設計」檢視中的 ASP 伺服器端 Script。

在「設計」檢視中，選取伺服器語言標籤的視覺圖示。
在 ASP Script 的「屬性」檢視窗中，按一下「編輯」按鈕。
編輯 ASP 伺服器端 Script，然後按一下「確定」。

使用屬性檢視窗編輯頁面中的 Script

在「屬性」檢視窗中，從「語言」彈出式選單選取 Script 語言，或在「語言」方塊中鍵入語言名稱。

註解：

如果您使用的是 JavaScript 而且不確定是哪種版本，請選取 JavaScript，而不要選取 JavaScript1.1 或 JavaScript1.2。
在「類型」彈出式選單中，指定 Script 的類型 (用戶端或伺服器端)。
(選擇性) 在「來源」方塊中，指定外部連結的 Script 檔案。按一下資料夾圖示以選取檔案，或者輸入路徑。
按一下「編輯」以修改 Script。

使用 JavaScript 行為

您可以使用「標籤」檢視窗的「行為」索引標籤，輕易地將 JavaScript (用戶端) 行為附加到頁面元素。如需詳細資訊，請參閱套用內建的 JavaScript 行為。

更快、更輕鬆地獲得協助

新的使用者？