JavaWeb04-HTML篇筆記(三)
對數據的表格進行隔行換色的顯示效果,使用JQuery完成該效果.
1.1.2 分析:1.1.2.1 技術分析:
【JQuery的選擇器】
- 基本過濾選擇器:
- odd :
- even :
【JQuery中添加和移除樣式】
- 如果樣式沒有事先定義,可以使用css方法為奇數行或者偶數行設置背景顏色.
- 如果已經在css文件中事先將樣式定義完成了,不能使用css方法了.使用JQ中的CSS類中的方法:
- addClass();
- removeClass();
1.1.2.2 步驟分析:
【步驟一】:引入jquery的js
【步驟二】:在頁面加載的函數中,選擇奇數行,添加樣式
1.1.3 代碼實現:
<script>
$(function(){
/*$("tr:odd").addClass("odd");
$("tr:even").addClass("even");*/
$("tbody tr:odd").addClass("odd");
$("tbody tr:even").addClass("even");
});
</script>
JavaWeb04-HTML篇筆記(三)
相關推薦
JavaWeb04-HTML篇筆記(三)
Java1.1 案例二:表格隔行換色的案例:1.1.1 需求:對數據的表格進行隔行換色的顯示效果,使用JQuery完成該效果.1.1.2 分析:1.1.2.1 技術分析:【JQuery的選擇器】 基本過濾選擇器: odd : even :【JQuery中添加和移除樣式】 如果
JavaWeb01-HTML篇筆記(三)
Java1.1 案例四:網站的首頁的顯示:1.1.1 需求:網站的首頁的設計:1.1.2 分析:1.1.2.1 技術分析:【HTML的表格標簽】<table><tr><td></td><td></td></tr></ta
JavaWeb03-HTML篇筆記(三)
Java1.1.1 總結:1.1.1.1 JS中的BOM對象: ? Window alert(); --彈出對話框 setInterval(); setTimeout(); clearInterval(); clearTimeout(); confirm(); -
JavaWeb04-HTML篇筆記(一)
Java1.1 上次課的內容回顧: JavaScript: JavaScript:基本使用: ECMAScript: 變量:弱變量類型: var i; 數據類型:原始類型和引用類型. 語句 運算符 對象: String,Boolean,Date,Math,Number,正則... 全局函數:eval
JavaWeb04-HTML篇筆記(二)
Java1.1 使用JQuery完成定時彈出廣告:1.1.1 需求:之前使用的JS的方式完成定時彈出廣告,現在使用JQuery完成同樣的效果:1.1.2 分析1.1.2.1 技術分析:【JQuery的概述】 ? 什麽是JQuery: JQuery是一個JS的框架(JS的類庫).對傳統的JS進行了封裝. 現在企
JavaWeb04-HTML篇筆記(五)
Java1.1 案例五:下拉列表的左右選擇:1.1.1 需求:在分類的修改的頁面中,有某個分類下的所屬的商品的信息.可以對這些商品信息進行選擇.1.1.2 分析:1.1.2.1 技術分析:【JQuery的選擇器】1.1.3 代碼實現: 傳統的JS的方式進行實現: window.onload=function(
JavaWeb04-HTML篇筆記(四)
Java1.1 案例四:使用JQuery完成省市二級聯動:1.1.1 需求:在註冊頁面上籍貫的信息,需要用到省市聯動效果.1.1.2 分析:1.1.2.1 技術分析:【JQuery的DOM操作】 * 常用的方法: * append(); ---在某個元素後
JavaWeb05-HTML篇筆記(三)
Java1.1 案例三:使用BootStrap布局首頁1.1.1 需求:1.1.2 分析:1.1.2.1 技術分析:【BootStrap的組件和JS的插件】1.1.2.2 步驟分析:【步驟一】:定義一個外層div元素【步驟二】:定義裏層8個div【步驟三】:為每層中的div添加元素.1.1.3 代碼實現: &
JavaWeb07-HTML篇筆記(三)
Java1.1 案例二:使用連接池改造JDBC的工具類:1.1.1 需求:傳統JDBC的操作,對連接的對象銷毀不是特別好.每次創建和銷毀連接都是需要花費時間.可以使用連接池優化的程序. 在程序開始的時候,可以創建幾個連接,將連接放入到連接池中.用戶使用連接的時候,可以從連接池中進行獲取.用完之後,可以將連接
JavaWeb09-HTML篇筆記(三)
java1.1 案例二:登錄成功以後5秒鐘跳轉到另一個頁面.1.1.1 需求:在登錄成功後,頁面5秒鐘跳轉到其他的一個頁面.1.1.2 分析:1.1.2.1 技術分析:【使用Http協議中的Refresh頭信息】Refresh之前已經介紹可以定時頁面跳轉.需要使用程序設置頭信息才可以.【response中設置
JavaWeb15-HTML篇筆記(三)
Java1.1 案例三:使用JQuery完成仿百度的信息提示:1.1.1 需求:在一個搜索頁面中,鍵盤輸入一些信息,在文本框下面給出一些提示信息(需要從服務器端進行查詢的).1.1.2 分析:1.1.2.1 步驟分析:? 創建一個數據庫和表:? 設計一個頁面? 文本框綁定一個事件.keyup? 在keyup所
JavaWeb01-HTML篇筆記(一)
Java1.1 案例一:網站信息頁面的顯示:1.1.1 需求:在網頁中顯示網站的信息的頁面:效果如下: 1.1.2 分析:1.1.2.1 技術分析:【HTML的概述】? 什麽是HTMLHTML:Hyper Text Markup Language --- 超文本標記語言. 標記語言:指的是通過一組標簽的形
JavaWeb01-HTML篇筆記(二)
Java1.1 案例二:網站圖片頁面顯示:1.1.1 需求:在一個頁面中往往圖文並茂.想在HTML中引入一個圖片如何處理?效果如下:1.1.2 分析:1.1.2.1 技術分析:【HTML的圖片標簽】 圖片標簽:<img> * 屬性: * src :圖片的來源.
JavaWeb01-HTML篇筆記(四)
Java1.1 案例五:網站的註冊頁面的顯示:1.1.1 需求:使用HTML完成註冊頁面的設計:1.1.2 分析:1.1.2.1 技術分析【HTML的表單標簽(*****)】 HTML的表單標簽:<form> 常用屬性: action屬性:提交的路徑.默認提交到當前頁面 method屬性:請求
JavaWeb02-HTML篇筆記(一)
Java1.1 案例二:使用DIV+CSS布局註冊頁面:1.1.1 需求:使用DIV+CSS的方式完成註冊頁面的布局:1.1.2 分析:1.1.2.1 技術分析:【CSS中的盒子模型】? 內邊距:padding.? 邊框:border? 外邊距:margin 【CSS中的定位】 position屬性設置定位:
JavaWeb03-HTML篇筆記(一)
Java1.1 上次課內容回顧: CSS: * CSS的概述:層疊樣式表. * 修飾HTML的頁面.使頁面與樣式分離. * CSS的語法: * 選擇器{屬性名:屬性值;屬性名:屬性值;...} * CSS的引入方式: * 行內樣式:在html元素上使用style屬性設置 *
JavaWeb03-HTML篇筆記(二)
Java1.1 案例一:使用JS完成圖片的輪播的效果:1.1.1 需求:1.1.2 分析:1.1.2.1 技術分析:【JS中的Window對象的定時的操作】 設置定時的方法 清除定時的方法1.1.2.2 步驟分析:【步驟一】創建一個HTML文件【步驟二】當頁面加載的時候開始計時.使用onload事件.【步驟
JavaWeb03-HTML篇筆記(四)
Java1.1 使用JS完成註冊頁面表單提示及校驗1.1.1 需求: 註冊頁面之前是彈出對話框的形式進行校驗的這種方式不是特別友好!可以將錯誤信息顯示到文本框的後面.而且當光標落入到文本框的時候,提示的信息.1.1.2 分析:1.1.2.1 技術分析:【JS的輸出】 document.getElementB
JavaWeb03-HTML篇筆記(五)
Java1.1 案例四:使用JS完成後臺數據展示的隔行換色的表格:1.1.1 需求:在後臺展示數據的頁面上,通常使用表格標簽進行數據的展示.沒有背景的表格比較難看的,可以使用JS控制表格的隔行換色.1.1.2 分析:1.1.2.1 技術分析:【使用JS獲得表格的行數】 獲得到控制的表格元素: var ta
JavaWeb03-HTML篇筆記(七)
Java1.1 案例六:使用JS完成省市聯動的效果:1.1.1 需求:在註冊頁面上有兩個下拉列表,左側省份的下拉列表一改變,右側的市的下拉列表也要跟著發生變化.1.1.2 分析:1.1.2.1 技術分析:【JS中創建數組】【JS的事件】下拉的列表的改變的事件.onchange.【JS的DOM的操作】創建元素: