JS如何輸出內(nèi)容，常用的輸出方式有哪些，本篇文章給大家介紹一下常用的六種JS輸出方式。
console.log()
使用控制臺輸出，這種方式是最常用的，可以輸出任何數(shù)據(jù)類型。一般快捷鍵F12可以打開瀏覽器控制臺，使用console.log()輸出內(nèi)容不會中斷程序執(zhí)行，方便開發(fā)人員進(jìn)行調(diào)試的。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script>
console.log("Hello World!");
console.log("你好");
</script>
</body>
</html>
alert()
alert()是瀏覽器的彈框函數(shù)，默認(rèn)彈出一個帶參數(shù)的警告框，每個瀏覽器展現(xiàn)的方式不盡相同。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script>
alert("警告框");//無返回值
alert("warning");
</script>
</body>
</html>
confirm()
和alert()使用和作用都差不多，不同的是這里彈出一個確認(rèn)框，函數(shù)返回一個布爾值。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script>
confirm("是否刪除？");//返回布爾值 根據(jù)用戶點(diǎn)擊按鈕返回
confirm("warning");
</script>
</body>
</html>
alert()函數(shù)不帶返回值，一般用于提示預(yù)警，confirm()返回一個布爾值，一般用于詢問語境。
prompt()
prompt也是一個彈出框函數(shù)，用于接收用戶輸入的數(shù)據(jù)。函數(shù)接收兩個字符串參數(shù)，返回一個字符串類型數(shù)據(jù)。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script>
var str = prompt("請輸入你的名字","Crice");//參數(shù)一:提示詞;參數(shù)二:默認(rèn)返回數(shù)據(jù)
console.log(str);
</script>
</body>
</html>
innerHTML&innerText
這兩不是函數(shù)，而是屬性，用于設(shè)置相應(yīng)元素的內(nèi)容。innerHTML值可以包含HTML元素（渲染字符串里的標(biāo)簽），而innerText不會渲染。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div id="myId"></div>
<div class="myCls"></div>
<div></div>
<script>
document.getElementById("myId").innerHTML = "Hello World!";
//輸出Hello World
document.getElementsByClassName("myCls")[0].innerHTML = "<h1>Hello World</h1>";
//輸出大寫加粗的Hello World
document.getElementsByTagName("div")[2].innerText = "<h1>Hello World</h1>";
//原樣輸出<h1>Hello World</h1>不會進(jìn)行渲染
</script>
</body>
</html>
使用innerHTML和innerText需要先獲取到DOM實例，獲取DOM元素的方法也有很多（上面的代碼展示了三種），這里就不再詳述了。如果獲取的對象不存在，就會出現(xiàn)報錯。
document.write()
document.write()向文檔流寫入內(nèi)容，直接將內(nèi)容打印到頁面中。
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script>
document.write("Hello World!");//向文檔直接寫入
</script>
</body>
</html>
