javascript內置對象
JavaScript 中的所有事物都是對象，如:字符串、數值、數組、函數等，每個對象帶有屬性和方法。
對象的方法:能夠在對象上執行的動作，form上的submit。
key:使用對象前要先定義，javascript中有String ,Date, Array等內置對象
2.定義一個對象(以數組對象爲例)
var objectName = new Array();//使用new定義對象
//訪問對象的屬性
objectName.propertyName;
//訪問對象的方法
objectName.methodName();1.Date日期對象
定義一個日期對象,例子如下
var timedate = new Date();自定義初始值
var timedate = new Date(2017,1,12);
var timedate = new Date('Jan',12,2017');Date的方法
get/setDate() //獲取或設置日期
get/setFullYear() //獲取或設置年份，用四位數表示
get/setYear() //獲取或設置年份
get/setMonth() //獲取或設置月份 0代表一月，後面類推
get/setHours() //獲取或設置小時 24小時制
get/setMinutes() //獲取或設置分鐘
get/setSeconds() //獲取或設置秒數
get/setTime() //獲取或設置時間（單位爲毫秒）key:一小時 60 分，一分 60 秒，一秒 1000 毫秒,時間推遲 1 小時,就是: x.setTime(x.getTime() + 60 * 60 * 1000);
2.String字符串對象
定義
var str = "String Object";
trim() //去掉空格
toUpperCase() //轉換成大寫
toLowerCase() // 轉換成小寫
chatAt(index) //index是必須的，表示字符在字符串的下標，從0開始
indexOf(substring,startpos) //substring是必須的，表示需檢索的字符串值；startpos是可選參數，規定在字符串開始檢索的位置。範圍是0-stringObject.length-1，默認從0
//開始；區分大小寫split(separator,limit)將字符串分割爲字符串數字，並返回此數組。separator 必選參數，從該參數指定的地方分割stringObject。limit 可選參數，分割的
//次數，如設置該參數，返回的子串不會多餘這個參數指定的數組，默認爲無限制次數。
substring(startPos,stopPos) //提取字符串中介於兩個指定下標中的字符,startPos 必須參數，非負整數，開始位置,stopPos 可選參數，非負整數，結束爲止，默認爲提取字符
//串的字符串對象的末尾
substr(startPos,length)
//startPos 必須參數，要提取的子串的起始位置，必須是數值。
//length 可選參數，提取字符串的長度，默認爲提取字符串的startPos到該字符串的結尾。key:如果參數startPos是負數，從字符串的尾部開始算起的位置。也就是說，-1 指字符串中最後一個字符，-2 指倒數第二個字符，以此類推。如果startPos爲負數且絕對值大
於字符串長度，startPos爲0；
例子----找到第二個出現的‘o’
var mystr="Hello World!"
document.write(mystr.indexOf('o',mystr.indexOf('o')+1));
split(separator,limit);例子----split(separator,limit)的使用，按指定符號隔開指定字符串
var mystr="ab-cde-fghijkl";
document.write(mystr.split('-')+ "<br />");
document.write(mystr.split('') + "<br />");
document.write(mystr.split('',3));例子----截取指定字符串
var mystr="Hello World!";
document.write(mystr.substring(mystr.indexOf('W'))+ "<br />");
document.write(mystr.substring(0,mystr.indexOf('W')-1));math對象屬性
E 返回算術常量e，即自然數的底數(2.718)
LN2 返回2的自然對數（0.693）
LN10 返回10的自然對數（2.302）
LOG2E 返回以2爲底的e的對數（約等於1.442）
LOG10E 返回以10爲底的e的對數（0.434）
PI 返回圓周率（3.14159）
SQRT1_2 返回2的平方根的倒數（0.707）
SQRT2 返回2的平方根（1.414）math對象方法
abs(x) 返回數的絕對值
acos(x) 返回數的反餘弦值
asin(x) 返回數的反正弦值
atan(x) 返回數的反正切值
atan2(y,x) 返回有X軸到點（x,y）的角度（單位是弧度）
ceil(x) 對數進行上舍入
cos(x) 返回數的餘弦
exp(x) 返回e的指數，e的x次方
floor(x) 對數進行下舍入
log(x) 返回數的自然對數（以e爲底）
max(x,y) 返回較大值
min(x,y) 返回較小值
pow(x,y) 返回x的y次冪
random() 返回0-1之間的隨機數
round(x) 把數四捨五入爲最接近的整數
sin(x) 返回數的正弦值
sqrt(x) 返回數的平方根
tan(x) 返回數的正切值
toSource() 返回該對象的源代碼
valueOf() 返回Math對象的原始值
4.Array數組對象
//定義了一個空數組:
var 數組名= new Array();
// 定義時指定有n個空元素的數組：
var 數組名 =new Array(n);
//定義數組的時候，直接初始化數據：
var 數組名 = [<元素1>, <元素2>, <元素3>...];屬性
length---數組的長度，因爲下標從零開始，數組中最後一個元素的下標加1數組方法
concat(str1，str2) //連接兩個或更多的數組，並返回連接後的結果
join(separator) //把數組的所有元素放入一個字符串。元素通過制定的分隔符進行分隔,默認用逗號隔開
pop() //刪除並返回數組的最後一個元素
push() //向數組的末尾添加一個或更多元素，並返回新的長度
reverse() //顛倒數組中元素的順序
shift() //刪除並返回數組的第一個元素
slice(start,end) //從某個已有的數組返回選定的元素，start到end(不包含該元素)，end未指定默認爲到數組結尾，可使用負值從數組的尾部選取元素
sort(方法函數) //對數組進行排序，如果不指定<方法函數>，則按unicode碼順序排列。如果指定<方法函數>，則按<方法函數>所指定的排序方法排序。
toSource() //返回該數組對象的源代碼
toString() //返回該數組隊象的字符串
toLocaleString() //返回本地數組
unshift() //向數組的開頭添加一個或更多的元素，返回值爲新的長度
valueOf() //返回數組對象的原始值
splice() //刪除元素並向數組添加新元素sort函數使用例子
function sortNum(a,b) {
return a-b;
}//升序，比較a>b，小的值向前移
function sortNum(a,b) {
return b-a;
}//降序，比較b>a,大的值向前移也可以理解爲把a-b的值排序，按從大到小排序
例子---算總分
<script type="text/javascript">
var date = new Date();
//成績是一長串的，字符串不好處理，找規律後分割放到數組裏更好操作哦
var scoreStr = "小明:87;小花:81;小紅:97;小天:76;小張:74;小小:94;小西:90;小伍:76;小迪:64;小曼:76";
var stuInfo = scoreStr.split(';');
var sum = 0;
var temp = 0;
for(var i=0;i<stuInfo.length;i++){
temp =stuInfo[i].split(':')[1];
sum = parseInt(temp) + sum;
}
//通過javascript的日期對象來得到當前的日期，並輸出。
document.write(date.getFullYear()+"年"+date.getMonth()+1 +"月" +
date.getDate() + "日 " + "星期"+date.getDay() +"--班級總分爲:" + sum);
</script>5.window對象---BOM對象的核心，指當前的瀏覽器窗口
方法
alert() //顯示帶有一段消息和一個確認按鈕的警告框
prompt() //顯示可提示用戶輸入的對話框
comfirm() //顯示帶有一段消息以及確認按鈕和取消按鈕的對話框
open() //打開一個新的瀏覽器窗口或查找一個已命名窗口
close() //關閉瀏覽器窗口
print() //打印當前窗口的內容
focus() //把鍵盤焦點給予一個窗口
blur() //把鍵盤焦點從頂層窗口移開
moveBy() //可相對窗口的當前座標把它移動指定的像素
moveTo() //把窗口的左上角移動到一個指定的座標
resizeBy() //按指定的像素調整窗口的大小
resizeTo() //把窗口的大小調整到指定的寬度和高度
scrollBy() //按照指定的像素值來滾動內容
scrollTo() //把內容移動到指定的座標
setInterval() //每隔指定的時間之後來執行代碼
setTimeout() //在指定的延遲事件之後執行代碼
clearInterval() //取消setInterval（）的設置
clearTimeout() //取消setTimeout（）的設置例子---簡單計時器
<script type="text/javascript">
var attime;
function clock(){
var time=new Date();
attime=time.getHours() + ":" + time.getMonth() + ":" + time.getSeconds();
document.getElementById("clock").value = attime;
}
window.setInterval(clock,1000);
</script>具體方法的介紹
setInterval(要執行的函數或代碼串，交互時間（單位毫秒）)
返回值，一個可以傳遞給clearInterval()從而取消對"代碼"的週期性執行的值；
clearInterval(id_of_setInterval);
參數:由setInterval（）返回的ID值;
setTimeout(要調用的函數或要執行的代碼串，在執行代碼時需要等待的時間
function startCount() {
document.getElementById('count').value=num;
num=num+1;
window.setTimeout("startCount()",1000);
}
clearTimeout(id_of_setTimeout);
參數:由setTimeout()返回的ID值，該值標識要取消的延遲執行代碼塊；
詳細例子
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>計時器</title>
<script type="text/javascript">
var num=0;
var i;
var flag =0;
function startCount(){
document.getElementById('count').value=num;
num=num+1;
i=setTimeout("startCount()",1000);
flag=1;
}
function stopCount(){
clearTimeout(i);
}
</script>
</head>
<body>
<form>
<input type="text" id="count" />
<input type="button" value="Start" οnclick="flag!=1?startCount():alert('please stop click me!')"/>
<input type="button" value="Stop" οnclick="stopCount()"/>
</form>
</body>
</html>
6.History對象---記錄用戶曾經瀏覽過網頁的URL，並可以實現瀏覽器前進與後退相似導航的功能；從窗口被打開的那一刻開始記錄，每個瀏覽器窗口，每個標籤頁乃至每個框架，都有自己的history對象與特定的window對象關聯
語法
window.history.[屬性|方法]
屬性
length 返回瀏覽器歷史列表中的URL數量
方法
back() //加載history列表中的前一個URL
forward() //加載histroy列表中的下一個URL
go(number) //加載history列表中的某個具體的頁面
參數:加載 history 列表中的某個具體的頁面的下標。
key:back()相當於go(-1)forward()相當於go(1)7.location對象---用於獲取或設置窗體URL,並且用於解析URL
語法：location.[屬性|方法]
屬性
hash //設置或返回從#開始的URL（錨）
host //設置或返回主機名和當前URL的端口號
hostname //設置或返回當前URL的主機名
href //設置或返回完整URL
pathname //設置或返回當前URL的路徑部分
port //設置或返回當前URL的端口號
protocol //設置或返回當前URL的協議
search //設置或返回從?開始的URL（查詢部分）
方法
assign() //加載新的文檔
reload() //重新加載當前文檔
replace() //用新的文檔替換當前文檔
location屬性分解
http://www.csdn.net:8080/list.php?courseid=17&chapterid=10#mediaid10
//整一個是一個href，http是protocol，www.csdn.net:8080是host，由hostname和port組成，list.php是pathname，？開始的部分是查詢部分，#開始的部分是hash部分
8.navigation對象---包含有關瀏覽器信息，通常用於檢測瀏覽器與操作系統的版本;
對象屬性
appCodeName //瀏覽器代碼名的字符串表示
appName //返回瀏覽器的名字
appVersion //返回瀏覽器的平臺版本信息
platform //返回運行瀏覽器的操作系統平臺
userAgent //返回由客戶機發送服務器的user-agent頭部用腳本鑑定瀏覽器類型
f
unction validB(){
var u_agent = navigator.userAgent;
var B_name="不是想用的主流瀏覽器!";
if(u_agent.indexOf("Firefox")>-1){
B_name="Firefox";
}else if(u_agent.indexOf("Chrome")>-1){
B_name="Chrome";
}else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){
B_name="IE(8-10)";
}
document.write("瀏覽器:"+B_name+"<br>");
document.write("u_agent:"+u_agent+"<br>");
} 9.screen對象---用於獲取用戶的屏幕信息
語法:
window.screen.屬性
屬性
availHeight //窗口可以使用的屏幕高度
availWidth //窗口可以使用的屏幕寬度
colorDepth //用戶瀏覽器表示的顏色位數
pixelDepth //用戶瀏覽器表示的顏色位數
height //屏幕的高度
width //屏幕的寬度過渡頁面的例子（等待n秒跳到下一個頁面）
<script type="text/javascript">
var num =5;
var index;
function count(){
document.getElementById("times").innerHTML = num;
num--;
if(num<0){
window.clearInterval(index);
back();
}
}
index = window.setInterval(count,1000);
function back(){
window.history.back();
}
</script>現在再次介紹DOM對象
DOM---文檔對象模型，定義訪問和處理HTML文檔的標準方法。元素節點，文本節點，屬性節點構成
節點屬性
nodeName 返回一個字符串，其內容是給定節點的名字
nodeType 返回一個整數，這個數值代表給定節點的類型
nodeValue 返回給定節點的當前值
遍歷節點樹
childNodes 返回一個數組，這個數組由給定元素節點的子節點構成
firstChild 返回第一個子節點
lastChild 返回最後一個子節點
parentNode 返回一個給定節點的父節點
nextSibling 返回給定節點的下一個節點
previousSibling 返回給定節點的上一個節點
DOM操作
createElement(element) // 創建一個新的元素節點
createTextNode() //創建一個包含着給定文本的新文本節點
appendChild() //指定節點的最後一個子節點列表之後添加一個新的子節點
insertBefore() //將一個給定子節點插入給定元素節點的給定子節點的前面
removeChild() // 從一個給定元素中刪除一個子節點
replaceChild() //把一個給定父元素裏的一個子節點替換爲另外一個節點前兩個是document的方法
getElementsByName（）返回帶有指定名稱的對象的集合
語法:
document.getElementsByName(name)
注意點：
1.因爲文檔中的name屬性可能不唯一，所有getElementsByName()方法返回的是元素數組，而不是一個元素；
2.和數組類似也有length屬性，可以訪問數組一樣的方法來訪問，從零開始
getElementsByTagName()---返回帶有指定標籤名的節點對象的集合。返回元素的順序是它們在文檔中的順序；
注意點:
1. Tagname是標籤的名稱，如p、a、img等標籤名。
2. 和數組類似也有length屬性，可以和訪問數組一樣的方法來訪問，所以從0開始。
區別getElementByID,getElementsByName,getElementsByTagName
取消相應複選框的腳本關鍵代碼如下
<script type="text/javascript">
function checkall(){
var hobby = document.getElementsByTagName("input");
for(var i=0;i<6;i++){getElementByID,getElementsByName,getEle
hobby[i].checked=true;
}
}
function clearall(){
var hobby = document.getElementsByName("hobby");
for(var i=0;i<hobby.length;i++){
hobby[i].checked = false;
}
}
function checkone(){
var j=document.getElementById("wb").value;
var hobby = document.getElementsByName("hobby");
hobby[parseInt(j)-1].checked = true;
}
</script>getAttribute()---通過元素節點的屬性名稱獲取屬性的值
語法
elementNode.getAttribute(name)
name:想要查詢的元素節點的屬性名字
elementNode:使用getEelementById()等方法獲取的元素節點
setAttribute()---增加一個指定名稱和值的新屬性，或者把一個現有的屬性設定爲指定的值。
語法:elementNode.setAttribute(要設置的屬性名,要設置的屬性值);
key:把指定的屬性設置爲指定的值，如果不存在具有指定名稱的屬性，該方法將創建一個新屬性。
節點屬性:
nodeName : 節點的名稱
nodeValue ：節點的值
nodeType ：節點的類型
nodeName 屬性: 節點的名稱，是隻讀的。
1. 元素節點的 nodeName 與標籤名相同
2. 屬性節點的 nodeName 是屬性的名稱
3. 文本節點的 nodeName 永遠是 #text
4. 文檔節點的 nodeName 永遠是 #document
二、nodeValue 屬性：節點的值
1. 元素節點的 nodeValue 是 undefined 或 null
2. 文本節點的 nodeValue 是文本自身
3. 屬性節點的 nodeValue 是屬性的值
三、nodeType 屬性: 節點的類型，是隻讀的。以下常用的幾種結點類型:
元素類型 節點類型
元素 1
屬性 2
文本 3
註釋 8
文檔 9訪問子節點childNodes---訪問選定元素節點的所有子節點的列表，返回的值可以看作一個數組，他具有length屬性
語法elementNode.childNodes
key:如果選定的節點沒有子節點，則該屬性返回不包含節點的NodeList
<ul>
空白符是文本節點
<li>javascript</li>
空白符是文本節點
<li>HTML/CSS</li>
空白符是文本節點
<li>jQuery</li> 空白符是文本節點
</ul>訪問子節點
一、firstChild 屬性返回‘childNodes’數組的第一個子節點。如果選定的節點沒有子節點，則該屬性返回 NULL。
語法：
node.firstChild
說明：與elementNode.childNodes[0]是同樣的效果。
二、 lastChild 屬性返回‘childNodes’數組的最後一個子節點。如果選定的節點沒有子節點，則該屬性返回 NULL。
語法：
node.lastChild
說明：與elementNode.childNodes[elementNode.childNodes.length-1]是同樣的效果。
訪問父節點
語法:
elementNode.parentNode
key:父節點只能有一個
訪問兄弟節點
nexSibling屬性可返回某個節點之後緊跟的節點（同一層級）
語法:nodeObject.nextSibling
previousSibling屬性可返回某個節點之前緊跟的節點（同一層級）
語法nodeObject.previousSibling
key:如果無此節點，則該屬性返回空;兩個屬性獲取的是節點，注意空白文本；
while (x && x.nodeType!=1){
x=x.nextSibling;
}
(不是元素節點(nodeType=1)則跳過)
插入節點
appendChild(newnode)---在指定節點的最後一個子節點列表之後添加一個新的子節點
newnode：指定追加的節點
例子(test是一個ul)
<script type="text/javascript">
var otest = document.getElementById("test");
var newnode = document.createElement("li");
newnode.innerHTML = "PHP";
otest.appendChild(newnode);
</script>
insertBefore()---在已有的節點前插入一個新的節點
語法:insertBefore(newnode,node);
newnode: 要插入的新節點
node:指定此節點前插入節點
key:otest.insertBefore(newnode,node); 也可以改爲: otest.insertBefore(newnode,otest.childNodes[0]);
例子
<script type="text/javascript">
var otest = document.getElementById("test");
var newnode = document.createElement("li");
newnode.innerHTML="PHP";
var node = otest.childNodes[1];
otest.insertBefore(newnode,node);
</script>刪除節點
removeChild()---從子節點列表中刪除某個節點，失敗返回NULL；刪除成功則返回被刪除的節點。
語法:
nodeObject.removeChild(node)
參數
node:必需，需要刪除的節點
key:把刪除的子節點賦值給 x，這個子節點不在DOM樹中，但是還存在內存中，可通過 x 操作。如果要完全刪除對象，要給 x 賦 null 值
function clearText() {
var content=document.getElementById("content");
var nodeLists = content.childNodes;
// document.write(nodeLists[0].firstChild);
for(var i=0;i<nodeLists.length;i++){
if(nodeLists[i].firstChild==null){
continue;
}
var x =content.removeChild(nodeLists[i]);
x=null;
}
}替換元素節點
parentNode.replaceChild(newnode,oldnode)---實現子節點(對象)的替換，返回被替換對象的引用
參數:newnode,必須，用於替換oldnode的對象
oldnode，必須，被newnode替換的對象
key:當 oldnode 被替換時，所有與之相關的屬性內容都將被移除，newnode 必須先被建立。
i標籤自帶斜體效果，<i></i>相當於<span style="font-style:italic"></span> ; <b></b>相當於<span style="font-style:bold"></span>所有瀏覽器都支持 <i> 標籤和<b>標籤。
function replaceMessage(){
var oldnode = document.getElementById("oldnode");
var newnode= document.createElement("i");
var newnodetext = document.createTextNode("Java");
newnode.appendChild(newnodetext);
oldnode.parentNode.replaceChild(newnode,oldnode);
}
創建元素節點
createElement()---創建元素節點，返回一個Element對象
語法:document.createElement(tagName);
參數:tagname:指明創建元素的類型
key:要與appendChild() 或 insertBefore()方法聯合使用，將元素顯示在頁面中。
例子
//創建鏈接
function create(url,text)
{
var urltxt = document.createElement("a");
urltxt.text = text;
urltxt.setAttribute("href",url);
urltxt.style.color = "red";
body.appendChild(urltxt);
}
// 調用函數創建鏈接
create("http://www.csdn.net","my blog!");創建文本節點
createTextNode(data)
參數:data,節點的文本
<script type="text/javascript">
var element = document.createElement("p");
element.className = "message";
var textNode = document.createTextNode("do it better!");
element.innerHTML ="two";
//element.appendChild(textNode);
document.body.appendChild(element);
</script>瀏覽器可視區域大小---獲得瀏覽器窗口的尺寸（不包含工具欄很滾動條）
Document對象的body屬性對應HTML文檔的<body>標籤
document.body.clientHeight
document.body.clientWidth
例子使用如下
//此行代碼執行時當前body的寬和高
document.write(document.body.clientHeight + "<br>");
document.write(document.body.clientWidth + "<br>");
//HTML文檔所在窗口的當前寬高
document.write(document.documentElement.clientHeight + "<br>");
document.write(document.documentElement.clientWidth + "<br>");
//所允許最大的寬和高
document.write(window.screen.availHeight + "<br>");
document.write(window.screen.availWidth + "<br>");在不同瀏覽器都實用的 JavaScript 方案：
var w= document.documentElement.clientWidth
|| document.body.clientWidth;
var h= document.documentElement.clientHeight
|| document.body.clientHeight;
網頁尺寸
scrollHeight---網頁內容的高度
scrollWidht---網頁內容的寬度
var w=document.documentElement.scrollWidth|| document.body.scrollWidth;
var h=document.documentElement.scrollHeight|| document.body.scrollHeight;
offsetHeight/offsetWidth
獲取網頁內容的高度很寬度，offsetHeight = clientHeight + 滾動條 + 邊框
var w= document.documentElement.offsetWidth|| document.body.offsetWidth;
var h= document.documentElement.offsetHeight|| document.body.offsetHeight;
最後看一張圖來理解下
例子
<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<script type="text/javascript">
window.onload = function(){
// 鼠標移動改變背景,可以通過給每行綁定鼠標移上事件和鼠標移除事件來改變所在行背景色。
var trs = document.getElementsByTagName('tr');
//i=0時候是那個頭標題
for(var i = 1; i < trs.length; i++){
trs[i].onmouseover = function(){
this.style.backgroundColor = "#f2f2f2";
}
trs[i].onmouseout = function(){
this.style.backgroundColor = "#fff";
}
}
}
// 編寫一個函數，供添加按鈕調用，動態在表格的最後一行添加子節點；
function add(){
var id = prompt("請輸入學號","");
var name = prompt("請輸入姓名","");
if(id==null||name==null){
return;
}
var newtr = document.createElement("tr");
var th_id = document.createElement("th");
var th_name = document.createElement("th");
var del_href = document.createElement("th");
//將格式文本處理好
th_id.innerHTML = "xh00" + id;
th_id.style.fontWeight="normal";
th_id.style.textAlign="left";
th_name.innerHTML = name;
th_name.style.fontWeight = "normal";
th_name.style.textAlign="left";
del_href.innerHTML = "<a href='javascript:;' οnclick='del(this)' >刪除</a>";
del_href.style.fontWeight = "normal";
del_href.style.textAlign="left";
//這個是所有table標籤組成的集合裏面的第一個，就是我們需要處理的table
var table = document.getElementsByTagName("table")[0];
newtr.appendChild(th_id);
newtr.appendChild(th_name);
newtr.appendChild(del_href);
table.appendChild(newtr);
//給新添加的行增加監聽函數
newtr.onmouseover = function(){
this.style.backgroundColor = "#f2f2f2";
}
newtr.onmouseout = function(){
this.style.backgroundColor = "#fff";
}
}
// 創建刪除函數
function del(obj){
var tr = obj.parentNode.parentNode;//父節點
tr.parentNode.removeChild(tr);//先用父節點找到組節點
}
</script>
</head>
<body>
<table border="1" width="50%" id="table">
<tr>
<th>學號</th>
<th>姓名</th>
<th>操作</th>
</tr>
<tr>
<td>xh001</td>
<td>王小明</td>
<td><a href="javascript:;" οnclick="del(this)">刪除</a></td> <!--在刪除按鈕上添加點擊事件 -->
</tr>
<tr>
<td>xh002</td>
<td>劉小芳</td>
<td><a href="javascript:;" οnclick="del(this)">刪除</a></td> <!--在刪除按鈕上添加點擊事件 -->
</tr>
</table>
<input type="button" value="添加一行" οnclick="add()" /> <!--在添加按鈕上添加點擊事件 -->
</body>
</html>
以上內容都是本人從慕課網上學習，有興趣的朋友可以去學一下。總的來說js學習和其他語言一樣都是需要時間才能沉澱。
