JavaScript 輸出介紹
JavaScript 是網際網路上最流行的 指令碼語言,這門語言可用於 HTML 和 web,更可廣泛用於伺服器、PC、膝上型電腦、平板電腦和智慧手機等裝置。JavaScript 沒有任何列印或者輸出的函式。 |
JavaScript 可以通過不同的方式來輸出資料:
- 使用 window.alert() 彈出警告框。
- 使用 document.write() 方法將內容寫到 HTML 文件中。
- 使用 innerHTML 寫入到 HTML 元素。
- 使用 console.log() 寫入到瀏覽器的控制檯。
你可以彈出警告框來顯示資料:
例項
< !DOCTYPE html > < html > < body > < h1 >我的第一個頁面 < /h1 >
< p >我的第一個段落。 < /p > < script >
window.alert(5 + 6); < /script > < /body > < /html >
如需從 JavaScript 訪問某個 HTML 元素,您可以使用 document.getElementById(id) 方法。
請使用 "id" 屬性來標識 HTML 元素,並 innerHTML 來獲取或插入元素內容:
例項
< !DOCTYPE html >
< html > < body > < h1 >我的第一個 Web 頁面 < /h1 > < p id= "demo" >我的第一個段落 < /p > < script >
document.getElementById("demo").innerHTML = "段落已修改。";
< /script > < /body > < /html >
以上 JavaScript 語句(在 <script> 標籤中)可以在 web 瀏覽器中執行:
document.getElementById("demo") 是使用 id 屬性來查詢 HTML 元素的 JavaScript 程式碼 。
innerHTML = "段落已修改。" 是用於修改元素的 HTML 內容(innerHTML)的JavaScript 程式碼。
在大多數情況下,在本教程中,我們將使用上面描述的方法來輸出:
上面的例子直接把 id="demo" 的 <p> 元素寫到 HTML 文件輸出中:
出於測試目的,您可以將JavaScript直接寫在HTML 文件中:
例項
< !DOCTYPE html >
< html > < body >
< h1 >我的第一個 Web 頁面 < /h1 >
< p >我的第一個段落。 < /p >
< script >
document.write(Date());
< /script > < /body > < /html >
請使用 document.write() 僅僅向文件輸出寫內容。
如果在文件已完成載入後執行 document.write,整個 HTML 頁面將被覆蓋。
例項
< !DOCTYPE html > < html > < body > < h1 >我的第一個 Web 頁面 < /h1 >
< p >我的第一個段落。 < /p > < button > "myFunction()" >點我 < /button > < script > function myFunction() {
document.write(Date());
}
< /script > < /body > < /html >
如果您的瀏覽器支援除錯,你可以使用 console.log() 方法在瀏覽器中顯示 JavaScript 值。
瀏覽器中使用 F12 來啟用除錯模式, 在除錯視窗中點選 "Console" 選單。
< !DOCTYPE html > < html > < body > < h1 >我的第一個 Web 頁面 < /h1 > < script > a = 5;
b = 6;
c = a + b;
console.log(c);
< /script > < /body > < /html >
例項 console 截圖:
程式中除錯是測試,查詢及減少bug(錯誤)的過程。
原文地址: https://www.linuxprobe.com/introduction-to-javascript-3.html
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/31559985/viewspace-2683652/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- JavaScript setTimeout() 介紹JavaScript
- JavaScript ECMAScript版本介紹JavaScript
- JavaScript 簡單介紹JavaScript
- JavaScript元素集合介紹JavaScript
- JavaScript 語法介紹JavaScript
- JavaScript常用物件介紹JavaScript物件
- javascript this詳細介紹JavaScript
- javascript instanceof的原型介紹JavaScript原型
- 簡單介紹克隆 JavaScriptJavaScript
- Android 輸入系統介紹Android
- javascript函式中with的介紹JavaScript函式
- 全面介紹JavaScript陣列方法JavaScript陣列
- JavaScript介紹及說明(01)JavaScript
- 簡單介紹JavaScript閉包JavaScript
- Javascript - 物件對映automapper介紹JavaScript物件APP
- Webpack 打包 Javascript 詳細介紹WebJavaScript
- JavaScript 6 的新特性介紹JavaScript
- javascript字串的語法介紹JavaScript字串
- web 練手 JavaScript 輸出WebJavaScript
- 檔案傳輸協議介紹協議
- 字元輸出流_Writer類&FileWriter類介紹和字元輸出流的基本使用_寫出單個字元到檔案字元
- JavaScript return語句簡單介紹JavaScript
- JavaScript希爾排序簡單介紹JavaScript排序
- javascript中generator函式的介紹JavaScript函式
- javascript高階函式的介紹JavaScript函式
- 伺服器傳輸協議介紹伺服器協議
- JavaScript 漢字方式輸出星期JavaScript
- JavaScript 輸出崑崙主管641480JavaScript
- JavaScript FormData的詳細介紹及使用JavaScriptORM
- [Javascript] Promise ES6 詳細介紹JavaScriptPromise
- 詳解javascript拖拽(一)基礎介紹JavaScript
- JavaScript內建物件介紹(重點介紹Math(),Date(),Array()以及案例應用)JavaScript物件
- JavaScript資料型別及輸出JavaScript資料型別
- javascript演算法的複雜度介紹JavaScript演算法複雜度
- JavaScript中的預解析(變數提升)介紹!JavaScript變數
- JavaScript中的預解析(變數提升)介紹JavaScript變數
- MQTT 釋出/訂閱模式介紹MQQT模式
- JavaScript資料結構之連結串列--介紹JavaScript資料結構