---
# System prepended metadata

title: IEH 程式隊 Workshop005 - 基礎程式2

---

# IEH 程式隊 Workshop005 - 基礎程式2


## 線上網頁程式編輯器
(可使用10 Minute Email註冊： https://10minutemail.net/)
https://jsfiddle.net/

## 基礎網頁程式教學資源
https://www.w3schools.com/

```
<div id="aaa">ok</div>
```

```
document.getElementById("aaa").innerHTML = "Hello JavaScript";
```

```
<button type="button" onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>
<p id="demo"></p>
```


## 加法器範例

* 使用HTML/CSS建構一個加法器外觀模板
* 使用JS建構一個加法器


```

<div id="out">

  <div id="aaa">ok</div>

  <br/>
  value1:<input id="bbb"></input>
  <br/>
  value2:
  <input id="ccc"></input>
  
  <br/>
  <br/>
  
  <button type="button" onclick="ff()">
  Add</button>
  
  <p id="demo"></p>

</div>
```


```
#out{
  padding: 65px;
  background-color: yellow;
  text-align: center;
}
```

```
document.getElementById("aaa").innerHTML = "Hello JavaScript";

function ff(){
document.getElementById('demo').innerHTML = Number(document.getElementById('bbb').value)+Number(document.getElementById('ccc').value)


}
```

## 如何把程式放到Local

## 課程問卷調查
https://forms.gle/saQFqZJzzveHNHCp7

