整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          HTML DOM td/th 對象

          td 對象

          td 對象代表了 HTML 中數據單元。

          在 HTML 表格中每個 <td> 標簽都會創建一個 td 對象。

          th 對象

          th 對象代表了 HTML 標準中的表頭單元。

          HTML 中每個 <th> 標簽都會創建一個 th 對象。

          td/th 對象屬性

          W3C: W3C 標準。

          屬性描述W3C
          abbr設置或返回單元格中內容的縮寫版本。Yes
          align已廢棄。 設置或返回單元格內部數據的水平排列方式。D
          axis設置或返回相關單元格的一個逗號分隔的列表。Yes
          background已廢棄。 設置或返回表格的背景圖片。D
          bgColor已廢棄。 設置或返回表格的背景顏色D
          cellIndex返回單元格在某行的單元格集合中的位置。Yes
          ch設置或返回單元格的對齊字符。Yes
          chOff設置或返回單元格的對齊字符的偏移量。Yes
          colSpan單元格橫跨的列數。Yes
          headers置或返回 header-cell 的 id 值。Yes
          height已廢棄。 設置或返回數據單元的高度D
          noWrap已廢棄。 nowrap 屬性規定表格單元格中的內容不換行。D
          rowSpan設置或返回單元格可橫跨的行數。Yes
          vAlign設置或返回表格單元格內數據的垂直排列方式。Yes
          width已廢棄。設置或返回單元格的寬度。D

          標準屬性和事件

          td/th 對象同樣支持標準的 屬性 和 事件。

          如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039,我們一起飛!

          一個簡單的 HTML 表格,帶有兩個單元格:

          <table border="1">

          <tr>

          <td>Cell A</td>

          <td>Cell B</td>

          </tr>

          </table>


          瀏覽器支持

          所有主流瀏覽器都支持 <td> 標簽。


          標簽定義及使用說明

          <td> 標簽定義 HTML 表格中的標準單元格。

          HTML 表格有兩種單元格類型:

          • 表頭單元格 - 包含頭部信息(由 <th> 元素創建)

          • 標準單元格 - 包含數據(由 <td> 元素創建)

          <th> 元素中的文本通常呈現為粗體并且居中。

          <td> 元素中的文本通常是普通的左對齊文本。


          提示和注釋

          提示:如果需要將內容橫跨多個行或列,請使用 colspan 和 rowspan 屬性!


          HTML 4.01 與 HTML5之間的差異

          HTML 5 中不再支持 HTML 4.01 中的某些屬性。


          屬性

          屬性描述
          abbrtextHTML5 不支持。規定單元格中內容的縮寫版本。
          alignleftrightcenterjustifycharHTML5 不支持。規定單元格內容的水平對齊方式。
          axiscategory_nameHTML5 不支持。對單元格進行分類。
          bgcolorrgb(x,x,x)#xxxxxxcolornameHTML5 不支持。HTML 4.01 已廢棄。 規定單元格的背景顏色。
          charcharacterHTML5 不支持。規定根據哪個字符來進行內容的對齊。
          charoffnumberHTML5 不支持。規定對齊字符的偏移量。
          colspannumber規定單元格可橫跨的列數。
          headersheader_id規定與單元格相關聯的一個或多個表頭單元格。
          heightpixels%HTML5 不支持。HTML 4.01 已廢棄。 設置單元格的高度。
          nowrapnowrapHTML5 不支持。HTML 4.01 已廢棄。 規定單元格中的內容是否折行。
          rowspannumber設置單元格可橫跨的行數。
          scopecolcolgrouprowrowgroupHTML5 不支持。定義將表頭單元格與數據單元格相關聯的方法。
          valigntopmiddlebottombaselineHTML5 不支持。規定單元格內容的垂直排列方式。
          widthpixels%HTML5 不支持。HTML 4.01 已廢棄。 規定單元格的寬度。

          全局屬性

          <td> 標簽支持 HTML 的全局屬性。


          事件屬性

          <td> 標簽支持 HTML 的事件屬性。

          如您還有不明白的可以在下面與我留言或是與我探討QQ群308855039,我們一起飛!

          avascript,從“最被誤解的語言”,最后神奇地轉變成為“最流行的語言”,證明它經受得起時間的考驗。雖然單獨來看,它的交互設計有些失敗,但是加上Ajax的完美配合,javascript就成了一款輕便并且又實用的好語法。

          如果想要更高效、更系統地學會javascript,最好采用邊學邊練的學習模式。

          如果覺得javascript的學習難度較高,不易理解,建議采用視頻的方式進行學習:

          Web前端開發零基礎入門HTML/CSS/JavaScript

          https://www.ixigua.com/6907467670300393988

          JavaScript概述

          (1)簡稱JS

          (2)一種腳本語言,腳本語言的特點

          Java語言是一種非腳本語言,屬于編譯型語言。

          JavaScript語言是一種腳本語言(解釋型語言),JavaScript的“目標程序”是以普通文本的形式保存。用記事本是可以直接打開的。瀏覽器打開就直接解釋執行了。

          (3)JavaScript和JScript的關系

          JavaScript是網景公司開發的,javascript之父是 布蘭登艾奇。JavaScript前身叫做LiveScript。當時網景公司開發JavaScript的目的是為了占領“瀏覽器”市場。網景公司有一個瀏覽器,當時非常著名:領航者瀏覽器Navigator。JavaScript語言是為領航者瀏覽器專門量身打造的。JavaScript只支持Navigator瀏覽器,其它瀏覽器不支持。這個時候微軟慌了,馬上組建團隊,開發了一種編程語言叫做Jscript,專門和JavaScript抗衡的,只支持IE瀏覽器。網景公司在某個歷史階段,和SUN公司有合作,SUN公司把LiveScript改名為JavaScript。

          (4)JavaScript主要用來操作HTML中的節點,產生動態效果

          JavaScript是一門編程語言,專門用來操作HTML頁面中的節點,讓網頁產生動態效果的。JavaScript中也有變量、數據類型、運算符、if語句、for循環、標識符、關鍵字等。

          (5)JavaScript和Java的區別

          JavaScript運行在瀏覽器當中,瀏覽器中有執行JS代碼的內核。

          Java運行在JVM當中。JavaScript和Java沒有任何關系。

          Java語言是SUN公司開發的,JavaScript這個名字是SUN公司給起的名。

          JavaScript選擇是對的,真的搭上了Java的順風車!

          JavaScript包括三塊:ECMAScript、DOM、BOM

          (1)ECMAScript是ECMA制定的262標準,JavaScript和JScript都遵守這個標準,ECMAScript是JavaScript核心語法

          (2)DOM編程是通過JavaScript對HTML中的dom節點進行操作,DOM是有規范的,DOM規范是W3C制定的。(Document Object Model:文檔對象模型)

          (3)BOM編程是對瀏覽器本身操作,例如:前進、后退、地址欄、關閉窗口、彈窗等。由于瀏覽器有不同的廠家制造,所以BOM缺少規范,一般只是有一個默認的行業規范。(Browser Object Model:瀏覽器對象模型)

          嵌入JS三種方式以及JS的注釋

          • 行間事件

          (1)<input type="button" value="hello" onclick="window.alert('hello js')" />

          (2)JS是一種基于事件驅動型的編程語言,當觸發某個事件之后,執行一段代碼

          (3)JS中的任何一個事件都對應一個事件句柄,例如鼠標單擊事件click,對應的事件句柄就是onclick,事件句柄都是以標簽的屬性方式存在。在事件句柄后面可以編寫JS代碼,當觸發這個事件之后,這段JS代碼則執行了。

          (4)JS中的字符串可以使用單引號括起來,也可以使用雙引號括起來

          (5)window是JS中的內置BOM頂級對象,代表當前瀏覽器窗口,window對象有一個alert()函數,該函數可以在瀏覽器上彈出消息框。

          (6)JS中的一條語句結束后可以使用“;”結尾,也可以不寫。

          (7)window.alert()中的window.可以省略。

          • 頁面script標簽嵌入

          (1)<script type="text/javascript">JS代碼</script>

          (2)window.alert()的執行會阻塞當前頁面的加載

          (3)一個頁面中可以寫多個腳本塊

          (4)腳本塊的位置沒有限制

          (5)暴露在腳本塊中的JS代碼在頁面打開的時候遵循自上而下的順序依次逐行執行

          • 外部引入

          (1)<script type="text/javascript" src="js文件路徑"></script>

          (2)<script type="text/javascript" src="js文件路徑">這里不能寫JS代碼</script>

          (3)這種寫法錯誤:<script type="text/javascript" src="js文件路徑"/>

          標識符和關鍵字

          (1)標識符命名規則和規范按照java執行

          (2)關鍵字不需要刻意記

          變量

          • 變量的聲明與賦值

          (1)變量未賦值,系統默認賦值undefined

          (2)JS是一種弱類型編程語言,一個變量可以接收任何類型的數據

          (3)一行上也可以聲明多個變量

          • 函數的定義與調用

          (1)函數類似于java語言中的方法,是一段可以完成某個功能的可以被重復利用的代碼片段

          (2)定義函數的兩種語法

          第一種:普通函數定義,這種方式較多

          function 函數名(形式參數列表){

          函數體;

          }

          例如:

          function sum(a, b){
          return a + b;
          }

          注意:

          a和b是形式參數列表,也是兩個局部變量。

          JS中的函數不需要指定返回值類型,因為JS是弱類型編程語言,變量可以接收任何類型的數據,也就是說JS中的函數可以返回任何類型的數據,當然也可以不返回任何數據。返回數據使用return語句。

          JS中的函數在調用的時候,實參可以隨意,例如調用以上的sum函數,可以這樣調用:sum(),沒有傳任何實參的時候a和b變量沒有賦值,則a和b都是undefined。也可以這樣調用sum(10),這樣就表示a變量賦值10,b變量仍然是undefined。還可以這樣調用:sum(1,2),這樣則表示a是1,b是2。

          第二種:如果是把函數的聲明當做類進行定義這種方式較多

          函數名 = function(形式參數列表){

          函數體;

          }

          例如:

          sum = function(a, b){
          return a + b;
          }

          (3)JS中的函數定義在腳本塊中,頁面在打開的時候,函數并不會自動執行,函數是需要手動調用才能執行的。

          (4)由于JS是一種弱類型編程語言,所以函數不能同名,沒有重載機制

          (5)這樣的代碼順序是可以的,頁面打開的時候會先進行所有函數的聲明,函數聲明優先級較高。

          <script type="text/javascript">
          sayHello();
          function sayHello(){
          alert("Hello JS");
          }
          </script>

          (6)用戶點擊按鈕,調用函數

          <script type="text/javascript">
          function sayHello(){
          alert("hello js");
          }
          </script>
          <input type="button" value="hello" onclick="sayHello();"/>
          • 局部變量和全局變量

          (1)局部變量:函數的形參是局部變量,另外使用var關鍵字在函數體中聲明的變量是局部變量,函數執行結束之后,局部變量的內存就釋放了。

          (2)全局變量:在函數體外聲明的變量屬于全局變量,另外不使用var關鍵字聲明的變量無論位置在哪,它都是全局變量,全局變量在瀏覽器關閉時銷毀。

          JS數據類型

          • typeof運算符
          • JS中為什么會有typeof運算符
          • typeof運算符怎么用,代碼怎么寫

          語法格式是:

          function sum(a, b){
          if("number" === typeof a && "number"=== typeof b){
          return a + b;
          }
          alert("數據格式不合法");
          return 0;
          }

          typeof運算符的運算結果都是全部小寫的字符串

          "undefined"

          "number"

          "string"

          "boolean"

          "object"

          "function"

          ES6版本之前的數據類型有6種

          • Undefined

          只有一個值undefined,變量聲明沒賦值,系統默認賦值undefined

          • Number

          (1)Number類型包括哪些值:0,1,-1,3.14,12,300,NaN,Infinity

          (2)parseInt()函數

          (3)parseFloat()函數

          (4)Math.ceil()函數:向上取整

          (5)isNaN()函數

          • String

          (1)可以使用單引號,也可以用雙引號

          (2)JS中的字符串包括小String,也包括大String,小String屬于原始類型,大String是JS的內置對象,大String屬于Object類型。

          (3)無論大String還是小String,它們的屬性和方法都是通用的。

          (4)字符串中常用方法講一些,主要講解字符串的substr()和substring()的區別。

          • Null

          (1)該類型只有一個值:null

          (2)typeof運算符的執行結果是"object"

          • Boolean

          (1)只有兩個值:true和false

          (2)Boolean()函數

          (3)JS中的if語句自動調用Boolean()函數。

          • Object

          (1)JS中如何定義一個類。

          (2)JS中如何創建一個對象。

          (3)JS中如何訪問對象屬性,調用對象的方法。

          (4)JS中的一個函數,既是函數聲明,又是類的定義,同時函數名也可以看做構造方法名。直接調用函數表示普通函數調用,如果使用new運算符來調用該函數則會創建對象。

          (5)使用prototype屬性動態的給對象擴展屬性以及方法。

          • ES6版本及之后包括的數據類型有8種

          除了以上6種類型之外,還有兩種類型分別叫做:Symbol和BigInt

          null NaN undefined區別

          (1)=、==、===三者的區別

          (2)null NaN undefined三者類型不同,null和undefined的值可以等同

          JS中的事件

          • 常用事件

          (1)blur失去焦點

          (2)change下拉列表選中項改變,或文本框內容改變

          (3)click鼠標單擊

          (4)dblclick鼠標雙擊

          (5)focus獲得焦點

          (6)keydown鍵盤按下

          (7)keyup鍵盤彈起

          (8)load頁面加載完畢

          (9)mousedown鼠標按下

          (10)mouseover鼠標經過

          (11)mousemove鼠標移動

          (12)mouseout鼠標離開

          (13)mouseup鼠標彈起

          (14)reset表單重置

          (15)select文本被選定

          (16)submit表單提交

          • 注冊事件的兩種方式

          (1)在標簽中使用事件句柄的方式注冊事件

          <body onload="sayHello()"></body>

          (2)在頁面加載完畢后使用JS代碼給元素綁定事件

          <script>
          window.onload = sayHello;
          </script>
           
          <script>
          window.onload = function(){
           
          }
          </script>

          重點:通過事件注冊,理解回調函數的概念

          • 代碼的執行順序

          這是一種錯誤的寫法:

          <body>
          <script type="text/javascript">
          var elt = document.getElementById("btn");
          </script>
          <input type="button" id="btn" value="mybtn"/>
          </body>

          這樣寫:

          <body>
          <input type="button" id="btn" value="mybtn"/>
          <script type="text/javascript">
          var elt = document.getElementById("btn");
          </script>
          </body>

          或者這樣寫:

          <body>
          <script type="text/javascript">
          window.onload = function(){
          var elt = document.getElementById("btn");
          }
          </script>
          <input type="button" id="btn" value="mybtn"/>
          </body>
          • 通過keydown事件演示回車鍵13,ESC鍵27

          JS運算符之void

          運算符就講這一個,告訴學生其它運算符和java一樣用。void主要講:javascript:void(0)的用法。

          JS之控制語句

          告訴學生控制語句和Java一樣用,課堂上不再講解。只講一下for..in語句的使用,使用for..in語句遍歷數組,以及遍歷一個對象的屬性。

          JS內置對象

          • Array

          (1)創建數組

          (2)JS中的數組特點

          (3)JS中數組對象常用方法:push,pop,join,reverse等。

          (4)數組遍歷

          • Date

          (1)new Date() 獲取當前系統時間

          (2)new Date().getTime()獲取時間戳

          (3)new Date().getFullYear()、getMonth()等方法。

          BOM和DOM的區別與聯系

          BOM: Browser Object Model(瀏覽器對象模型),通過BOM的對象和方法可以完成瀏覽器窗口的操作,例如:關閉瀏覽器,前進,后退,修改地址欄上的地址等,這些操作都屬于BOM。BOM的頂級內置對象是window。

          DOM: Document Object Model(文檔對象模型),通過DOM的對象和方法可以完成網頁中元素的增刪改,讓網頁產生動態效果,DOM的頂級內置對象是document。

          DOM編程案例

          • innerHTML innerText操作div和span
          • JS的正則表達式(Regular Expression)
          • 正則表達式概述

          (1)正則表達式是一門獨立的學科,不止用在JS中

          (2)正則表達式專門用來做字符串格式匹配的

          • 常用的正則表達式符號

          參考30分鐘入門正則表達式:

          ^ 字符串開始

          $ 字符串結束

          \s 空白

          * 0~N次

          + 1~N次

          ? 0或1次

          {3} 3次

          {3,} 3~N次

          {3,5} 3~5次

          (a|b) a或b

          [a-z] a到z

          [^abc] 不是abc

          • 會寫簡單的正則表達式

          (1)qq號正則

          (2)必須由數字和字母組成,不能含有其它符號的正則

          (3)給學生一些常用的正則表達式

          • 會創建JS中的正則表達式對象

          (1)var regExp = new RegExp("^[1-9][0-9]{4,}$");

          (2)var regExp = /^[1-9][0-9]{4,}$/;

          • 會調用JS中正則表達式對象的test()函數

          寫一個校驗用戶名只能由數字和字母組成的案例

          • 表單驗證

          (1)用戶名不能為空

          (2)用戶名必須在6-14位之間

          (3)用戶名只能由數字和字母組成,不能含有其它符號(正則表達式)

          (4)密碼和確認密碼一致,郵箱地址合法。

          (5)統一失去焦點驗證

          (6)錯誤提示信息統一在span標簽中提示,并且要求字體12號,紅色。

          (7)文本框再次獲得焦點后,清空錯誤提示信息,如果文本框中數據不合法要求清空文本框的value

          (8)最終表單中所有項均合法方可提交

          • 復選框全選和取消全選

          document.getElementById()

          document.getElementsByName()

          document.getElementsByTagName()

          以上三個函數告知學生很重要

          • 獲取下拉列表選中項的value

          change事件

          • 顯示網頁時鐘

          window.setInterval()

          window.clearInterval()

          主要兩個函數

          捎帶著提一下window.setTimeout()

          • 拼接html的方式,設置table的tbody
          <table>
          <thead></thead>
          <tbody id="userListTbody"></tbody>
          </table>
          <script>
          var html = "";
          html += "<tr>";
          html += "<td>";
          html += "zhangsan";
          html += "</td>";
          html += "<td>";
          html += "2000-10-11";
          html += "</td>";
          html += "</tr>";
           
          html += "<tr>";
          html += "<td>";
          html += "lisi";
          html += "</td>";
          html += "<td>";
          html += "2001-10-11";
          html += "</td>";
          html += "</tr>";
           
          var userListTbody = document.getElementById("userListTbody");
          userListTbody.innerHTML = html;
          <script>
          • 要求學生在此之后會使用瀏覽器的F12

          會使用F12調試面板:第一會調錯;第二會定位并查看HTML頁面元素。

          BOM編程案例

          • window.open()和window.close()
          • window.alert()和window.confirm()
          • 如果當前窗口不是頂級窗口,將當前窗口設置為頂級窗口
          if(window.top != window.self){
          window.top. location = window.self. location;
          }
          • 歷史記錄

          window.history.back(); window.history.go(-1); window.history.go(1);

          • window.location.href

          提示一下document.location.href也可以完成同樣功能

          JSON對象

          • eval函數
          • 怎么創建json對象以及訪問json對象的屬性
          • json在開發中有什么用

          數據交換作用

          • 寫一個這樣的JSON

          描述一個班級的總人數,另外包括描述班級中每個學生的信息,這樣的JSON怎么寫

          • JS中[]和{}的區別

          總結一下瀏覽器向服務器發送請求的常見方式

          (1)直接在瀏覽器地址欄上寫URL,get請求。

          (2)點擊頁面超鏈接,get請求。

          (3)提交form表單,可以是get,也可以是post。

          (4)window.open(url);

          (5)window.location.href=url;

          (6)document.location.href=url;


          主站蜘蛛池模板: 久久久精品人妻一区亚美研究所 | 成人无码精品一区二区三区| 无码人妻精品一区二区蜜桃| 免费人人潮人人爽一区二区| 久久国产香蕉一区精品 | 久久久国产精品亚洲一区| 亚洲午夜精品一区二区麻豆| 美女免费视频一区二区| 国产成人无码一区二区三区| 怡红院一区二区三区| 日本成人一区二区三区| 天天视频一区二区三区| 看电影来5566一区.二区| 日本一区二区三区在线看| 亚洲一区二区免费视频| 日韩精品无码人妻一区二区三区| 国产成人一区二区三区视频免费| 精品性影院一区二区三区内射| 精品人妻无码一区二区三区蜜桃一 | 91精品一区二区三区在线观看| 免费一区二区三区四区五区| 国产福利日本一区二区三区| 亚洲av综合av一区| 精品亚洲AV无码一区二区| 国产裸体歌舞一区二区| 日本一区二区三区不卡视频中文字幕 | 中文字幕乱码人妻一区二区三区| 国产伦一区二区三区免费| 精品一区二区三区在线成人| 中文无码精品一区二区三区| 国产成人AV区一区二区三| 亚洲av日韩综合一区二区三区| 精品视频一区二区三区在线观看| 五十路熟女人妻一区二区| 日韩精品无码一区二区三区不卡| 国产美女露脸口爆吞精一区二区| 国产精品亚洲专区一区| 精品女同一区二区| 亚洲中文字幕丝袜制服一区| 国产一区二区三区在线免费观看 | 国产一区二区三区影院|