Create & Append

<!DOCTYPE html> <html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta charset="UTF-8"> <title>Untitled Document</title> <script> function append() { var mylist=document.getElementById("mylist"); var newli=document.createElement("li"); var myname=document.getElementById("myname").value; var mynum=document.getElementById("mynum").value; mylist.appendChild(newli); newli.innerHTML=`<tr><td> ${myname} </td> <td> ${mynum} </td>…

Create Table DOM

<!DOCTYPE html> <html><head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta charset="utf-8"> <title>無標題文件</title> <style> .mytable{ border:2px solid black; border-collapse: collapse; background: #AFFCDC; margin-bottom: 20px; } .mytable td{ border:1px solid black; width:60px; padding:5px; text-align:…

Create Delete DOM

<!doctype html> <html> <head> <meta charset="utf-8"> <title>無標題文件</title> <style> *{ padding:0; margin:0; } .classBox{ width:600px; height:600px; border:2px solid black; background-color: #EDEAEA; margin: 0 auto; } .btn{ padding:20px; font-size: 24px; } .boxer{…

Move Control Dom

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>無標題文件</title> <script> var obj; var mytimer; var c=0; var y=0; var x=0; var speed=0; var player;…

Tree View Dom

<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> ul, #myUL { list-style-type: none; } #myUL { margin: 0; padding: 0; } .caret { cursor: pointer; -webkit-user-select: none; /* Safari…

Class

<body> <script type="text/javascript"> class Student { constructor(_name, _sid, _js, _ai, _hp, _wp, _ec) { this.name=_name; this.sid=_sid; this.js=_js; this.ai=_ai; this.hp=_hp; this.wp=_wp; this.ec=_ec; } print(){ document.write(`${this.name} \t ${this.sid} \t ${this.js} \t ${this.ai}…

176. Intl Numbers

//Intl Numbers const num = 24153251.89; const options = { style: 'currency', //It can be unit, percent or currency unit: 'celsius', currency: 'EUR', //userGrouping: false, }; console.log('US:', new Intl.NumberFormat('en-US', options).format(num));…

Creating Dates

1. const new = new Date(); console.log(now); => current time; 2. console.log(new Date('December 24, 2015')); => Thu Dec 24 2015 00:00:00 GMT+0000 3. console.log(new Date(2031,10,11,12,12,10)); 4. console.log(new Date(0)); => Thu…