Taylor’s University Business Zoom 2016
TOP 5 Winners Participation Early Scholarship
Binding Attributes ‘v-bind’
index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Vue Basics</title> <link href="https://fonts.googleapis.com/css2?family=Jost:wght@400;700&display=swap" rel="stylesheet" /> <link rel="stylesheet" href="styles.css" /> <script src="https://unpkg.com/vue@next" defer></script> <script src="app.js" defer></script>…
Get To Know Vue
//pure js /*const buttonEl = document.querySelector('button'); const inputEl = document.querySelector('input'); const ulEl = document.querySelector('ul'); buttonEl.addEventListener('click', function(){ const inputValue = inputEl.value; const listItem = document.createElement('li'); if (inputValue != ''){ listItem.textContent =…
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;…