024高考查分時間最新匯總及詳細查詢渠道
一、查分時間概覽
隨著2024年高考的結束,考生和家長都迫切地想要知道自己的成績。以下是部分省份的高考成績公布時間及具體查詢渠道(具體時間可能會根據當地實際情況有所調整,請以當地教育考試院或招生辦公室的官方公告為準):
北京市
上海市
廣東省
浙江省
江蘇省
山東省
四川省
河北省
河南省
湖北省
湖南省
6. 陜西省
山西省
(注意:以上僅為部分省份的示例,具體查詢渠道和方式可能因省份而異,請考生和家長根據當地教育考試院的官方公告進行查詢。)
二、注意事項提醒
三、后續安排建議
總之,高考查分是考生和家長關注的焦點之一。請密切關注官方公告和通知,了解最新信息和規定。同時,也祝愿所有考生都能取得滿意的成績!
單數字時鐘開發實例
借助于JavaScript window對象所提供的計時觸發函數setInterval可以實現前端動畫效果的設計與制作。本例主要以setInterval方法為基礎介紹簡單數字時鐘的開發實例。
本數字時鐘設計實現格式為00:00:00類型結構的數字時鐘,因此需要準備時鐘顯示相關數字及間隔符號的素材。最終實現效果如下所示:
數字時鐘實現效果
設計實現效果如上圖,因此需要準備0-9數字與":"字符,素材設計較為簡單直接采用PhotoShop進行設計最終導出保存為png格式圖片,素材圖片展示如下:
數字及間隔符素材
動態數字時鐘整體設計按照顯示格式要求,使用div展示每一位數字或者間隔符。在計時周期內調用處理函數獲取系統當前的時間,并根據當前時間計算出每一個div中應當展示的內容,最終實現時鐘的動態效果。主要設計階段如下:
1、整體HTML頁面布局設置
這個階段主要完成時鐘構成的8個DIV的布局設計,為下一步顯示時鐘提供基礎。本例DIV整體布局設計樣式效果如下:
時鐘布局層
時鐘基本布局層描述如上圖,為展示我們將其背景設置了不同顏色,后期在8個DIV塊中我們用于顯示時鐘相關數字及字符。
2、定義ID選擇器實現DIV背景設置
本例中數字時鐘數字與字符通過設置為DIV層的背景用于實現展示。本例使用ID選擇器用于實現0-9數字與間隔符的展示。由于我們數字時鐘相關素材都在統一圖片中,因此我們在設置展示數字與字符的過程中需要對每一個樣式中的背景截取位置通過background-position屬性進行精確控制。完成9個數字與一個分隔符樣式定義之后,可以將8個時鐘顯示DIV設置對應的ID標簽,實現內容展示,如我們將以上時鐘布局DIV標簽全部設置為展示數字0的ID標簽,效果如下:
ID標簽控制顯示內容
ID標簽控制DIV顯示內容如上圖所示,這樣我們就可以分別設置8個DIV層的ID標簽值實現內容的改變,如我們使用8對應的ID設置,則全部顯示數字8,效果如下:
ID標簽值對應數字8顯示效果
在實際實現中由于8個DIV結構是固定的,包含了兩個分割符號,這部分可以直接設置為分割符號,如下所示:
帶有分割符號的8位顯示效果
3、時間獲取與處理
該數字時鐘時間通過JavaScript提供的Date對象的實例化,獲取本地的時間。然后從時間數據中分別讀取出小時、分鐘、秒。所使用函數主要包括以下函數:
getHours();//用于獲取時間對象中的小時數,取值范圍0-23
getMinutes();//用于獲取時間對象中的分鐘數,取值范圍0-59
getSeconds();//用于獲取時間對象中的秒數,取值范圍0-59
在獲取系統時間對應的小時、分鐘、秒之后需要確定各部分其中的每一位,由于我們時鐘格式是固定的,每一部分均為兩位,因此需要對10以內的數字進行判斷,如小于10則需要單獨補充最高位的0,如果大于等于10,則需要取出其中的十位與個位。個位取值較為簡單用獲取的值除以10取余數即為個位,十位數字將獲取值除以10之后向下取值則可獲取10位數字。如數字35,十位計算可得3,個位余數為5。
4、設置DIV層對應的ID標簽
在分別獲取小時、分鐘、秒對應的每一位之后,可以進一步將其設置顯示在對應DIV層中,即設置層的背景。要解決這個問題需要能夠精確獲取每一個DIV層。借助Document對象我們可以獲取所有的層,本例我們將8個展示時鐘層,外部嵌套一個層。使用getElementById方法獲取該元素,通過該元素的childNodes屬性以數組形式獲取內部所有的DIV層。這樣可以通過數組對應下標分別表示每一個時鐘DIV。注意問題獲取的全部子節點除顯示時鐘的元素節點之外還有文本節點,需要確定哪些是對應的DIV元素節點。使用console.log輸出該數組就可以確定,數組輸出如下:
子節點列表
在該列表中我們可知對應案例編寫代碼,1,3為小時對應的2個DIV;7,9為分鐘對應的2個DIV;13,15為秒數對應的DIV。數組下標確定后就可以獲取對應的Div元素使用setAttribute()方法,實現ID屬性的設置。
5、計時器設計
為保證能夠動態獲取本地時間,并將其處理顯示的對應DIV層中,需要使用window對象提供的setInterval(func,time)方法,定義觸發周期及處理函數。考慮到間隔符號閃爍,我們設置觸發之后為500毫秒。在觸發函數中實現系統時間獲取及與時鐘DIV關聯動態改變各DIV的ID屬性。
按照以上設計思路,我們可以完成該案例開發,案例圖片處理使用PhotoShop CC2019,代碼編輯使用SublimeText。實現過程主要包括頁面布局設計實現與JavaScript腳本編寫的實現。其中頁面布局設計使用DIV嵌套實現,代碼如下:
頁面DIV布局
頁面DIV布局代碼如上圖所示,其中我們可以看到在初始狀態下除間隔符dd標簽之外,其他的數組部分都為d0,即我們設置的數字0展示。我們為調用背景素材實現背景展示,分別定義了d0~d9用于展示數字,dd標簽用于顯示間隔符,ds標簽用于隱藏間隔符。該部分樣式代碼如下:
時鐘數字與間隔符樣式設置
JavaScript腳本部分主要用于獲取系統時間,動態實現前端8個展示時鐘的DIV層ID標簽的設置。在窗體的onload時間中我們獲取所有的時鐘DIV元素,并啟動計時器。實現代碼如下:
頁面加載事件
頁面加載事件如上圖所示,其中回調函數setVal用于實現接收本地事件進行DIV層ID標簽設置。該函數實現代碼如下:
回調函數
處理函數代碼如上圖所示,自定義函數主要用于實現設置小時、分鐘與秒對應的DIV層ID屬性值,實現數字與間隔符切換。其中小時處理函數setH()代碼描述如下:
小時處理函數代碼
其他代碼處理與此類似,只是在處理完數字之后設置的nodes元素不同,這里的nodes對象存儲了外層ID為test的DIV所有子元素。由于篇幅限制,其他函數不再一一說明。如需完整代碼請關注后私信。本例最終實現效果展示如下圖:
動態展示效果
本頭條號長期關注編程資訊分享;編程課程、素材、代碼分享及編程培訓。如果您對以上方面有興趣或代碼錯誤、建議與意見,可在評論區回復。更多程序設計相關教程及實例分享,期待大家關注與閱讀!相關文章鏈接如下:
前端設計-JavaScript中父窗口與子窗口間的通信
前端設計-JavaScript實現Node節點的遍歷
Web前端設計-常用CSS選擇器說明及實例分析(二)
Web前端設計-常用CSS選擇器說明及實例分析(一)
avaScript、js、vue獲取當前天、周、月、年、上一日、下一日、上一周、下一周、上一月、下一月、上一年、下一年時間范圍(moment.js)
主要使用了moment.js插件對這些時間進行了整理,moment的安裝過程點擊這里
話不多說,直接上代碼
date為當前時間,如"2022-01-03 15:31:21"
當前天
nowDay(date) {
let startDate=moment(date).startOf("days").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).endOf("days").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
}
輸出:["2022-01-03 00:00:00",“2022-01-03 23:59:59”]
當前周
nowWeek(date) {
let startDate=moment(date).startOf("week").add(1, "days").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).endOf("week").add(1, "days").format("YYYY-MM-DD HH:mm:ss");
return [startDate, endDate]
}
輸出:["2022-01-03 00:00:00",“2022-01-09 23:59:59”]
當前月
nowMonth(date) {
let startDate=moment(date).startOf("month").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).endOf("month").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
},
輸出:["2022-01-01 00:00:00",“2022-01-31 23:59:59”]
當前年
nowYear(date) {
let startDate=moment(date).startOf("year").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).endOf("year").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
},
輸出:["2022-01-02 00:00:00",“2022-12-31 23:59:59”]
前一天
preDay(date) {
let startDate=moment(date).subtract(1, "days").startOf("days").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).subtract(1, "days").endOf("days").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
},
輸出:["2022-01-02 00:00:00",“2022-01-02 23:59:59”]
后一天
nextDay(date) {
let startDate=moment(date).add(1, "days").startOf("days").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).add(1, "days").endOf("days").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
},
輸出:["2022-01-04 00:00:00",“2022-01-04 23:59:59”]
上周
preWeek(date) {
let startDate=moment(date).weekday(-7).startOf("week").add(1, "days").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).weekday(-7).endOf("week").add(1, "days").format("YYYY-MM-DD HH:mm:ss");
return [startDate, endDate]
},
輸出:["2021-01-27 00:00:00",“2022-01-02 23:59:59”]
無限套娃可將得到的時間再次作為date進行輸入
下周
nextWeek(date) {
let startDate=moment(date).weekday(7).startOf("week").add(1, "days").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).weekday(7).endOf("week").add(1, "days").format("YYYY-MM-DD HH:mm:ss");
return [startDate, endDate]
},
輸出:["2022-01-10 00:00:00",“2022-01-16 23:59:59”]
上月
preMonth(date) {
let startDate=moment(date).subtract(1, "month").startOf("month").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).subtract(1, "month").endOf("month").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
},
輸出:["2021-12-01 00:00:00",“2021-12-31 23:59:59”]
下月
nextMonth(date) {
let startDate=moment(date).add(1, "month").startOf("month").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).add(1, "month").endOf("month").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
},
輸出:["2022-02-01 00:00:00",“2022-02-28 23:59:59”]
上年
preYear(date) {
let startDate=moment(date).subtract(1, "year").startOf("year").format("YYYY-MM-DD HH:mm:ss")
let endDate=moment(date).subtract(1, "year").endOf("year").format("YYYY-MM-DD HH:mm:ss")
return [startDate, endDate]
},
輸出:["2021-01-31 00:00:00",“2021-12-31 23:59:59”]
下年
*請認真填寫需求信息,我們會在24小時內與您取得聯系。