<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="css/style.css">
<title>Document</title>
</head>
<body>
<div id="main">hello</div>
<script src="js/all.js"></script>
</body>
</html>
像是說我現在寫個這邊的話寫個 div
那這個 div 的話我取的 id 好了 叫做 main
好 那假使我今天想要
在裡面去塞 h1 該怎麼做?
var el = document.getElementById('main');
var str = '<h1 class="blue">1234</h1>'
el.innerHTML = str+str;
像 textcontent 裡面就單純只能塞文字進去
那我今天想要把一個 Element html 標籤
給拉進去到裡面的話 我到底該怎麼做
那這個語法的話就是 innerHTML
這個方法呢 就是可以讓你去
增加 html 標籤在裡面了
所以你今天寫的話 你就必須寫 h1 1234
那這邊的話就是一個 單引號或雙引號包起來都可以
innerHTML 的特性啊
就是他會把裡面給清空
然後清空以後在去塞你要賦予的值給他
所以這點的話請同學務必注意一下
就是 innerHTML 的特性
他會在你指定的
id 或者是你指定的 class 裡面塞 html
就看你要塞什麼東西給他
但原本的東西就會被全部給刪除掉
這個做法其實在後面會講解到你要動態塞
你的陣列或者是 json 的列表的時候非常好用