一样要说明这是由彭彭影片撷取出来的例题
<!DOCTYPE html>
<html>
<head>
<title>HTML DOM</title>
<script type="text/javascript">
function change(){
var spanObj= document.getElementById("emotion")
if (spanObj.innerHTML=="good"){
spanObj.innerHTML="bad";
spanObj.style.color="blue";
}
else{
spanObj.innerHTML=="bad";
spanObj.innerHTML="good";
spanObj.style.color="green"
}
}
</script>
</head>
<body>
<div>
Today is a <span id="emotion" style="color:green;">good</span> day. Let's go to movie.
</div>
<button onclick="change()">Change</button>
</body>
</html>
我们分拆开来看上面的程序码
function change(){
var spanObj= document.getElementById("emotion")
if (spanObj.innerHTML=="good"){
spanObj.innerHTML="bad";
spanObj.style.color="blue";
}
else{
spanObj.innerHTML=="bad";
spanObj.innerHTML="good";
spanObj.style.color="green"
}
上方我们可以看到宣告一个名为spanObj的变数，在变数资料内放入了document.getElementById("emotion")，这个方式是可以用来抓取文件内ID设定为emotion的元素，接着使用回圈 if (spanObj.innerHTML=="good")代表着如果这个ID emotion内的资料为good的时候，就会执行spanObj.innerHTML="bad";spanObj.style.color="blue";这两行程序码，下方
else{
spanObj.innerHTML=="bad";
spanObj.innerHTML="good";
spanObj.style.color="green"
代表着如果资料为bad，就会再将资料good放进去取代，用这种方式建立起一个循环。
接着看到下方程序码
<div>
Today is a <span id="emotion" style="color:green;">good</span> day. Let's go to movie.
</div>
<button onclick="change()">Change</button>
我们可以看到我们用<span>标签去注记good这个字串，并且在这个元素内加入了id="emotion"，这边会呼应上方的函式，接着我们要想办法可以呼叫这个函式，所以我们使用了button设定一个按钮，在按钮内设定一个onclick去呼叫函式change()，使用者一旦按按钮就可以切换资料内容。
参考资料:
https://www.youtube.com/watch?v=iZ3LfVujGCM
https://ithelp.ithome.com.tw/articles/10202689
https://codertw.com/%E5%89%8D%E7%AB%AF%E9%96%8B%E7%99%BC/27430/
前几天大概讲完了 Angular 的 Component 的基本功能与介绍，在很多例子中可以看到在 ...
Rollup 是一个 JavaScript 的打包工具，目前我们常使用的 Webpack 也常拿来跟...
大家好，我是乌木白，今天要和大家介绍～ Sass 的另一个很好用的功能就是！！Mixin 什麽是M...
今天就来完成登入验证的部分! 昨天已经完成发送帐号密码到api，验证ok即发送一笔JWT给clien...
本篇章主要是先从技术层面来解释 URI 与 URL 及比较少使用到却与生活息息相关的 URN，让读者...