C# 結(jié)合 Javascript 測(cè)試獲取天氣信息
測(cè)試效果
獲取一些簡單的天氣信息,可以豐富我們的應(yīng)用系統(tǒng),比如開發(fā)一個(gè)小桌面,小組件,增加一些實(shí)用性的系統(tǒng)功能,本文將介紹如何使用 C# 并結(jié)合 JavaScript 獲取天氣信息,獲取的數(shù)據(jù)來源于 360 瀏覽器首頁數(shù)據(jù),成功的測(cè)試效果如下圖:
實(shí)現(xiàn)這樣的效果主要通過如下步驟:
1、通過C#服務(wù)端獲360歡迎頁網(wǎng)頁數(shù)據(jù)。
2、通過JavaScript 截取天氣數(shù)據(jù)片段。
3、通過截取的天氣數(shù)據(jù)片段,放置需要顯示的 DOM 容器當(dāng)中。
范例運(yùn)行環(huán)境
操作系統(tǒng): Windows Server 2019 DataCenter
.net版本: .netFramework4.7.1 或以上
開發(fā)工具:VS2019 C#
關(guān)鍵代碼
C#獲取網(wǎng)頁數(shù)據(jù)
獲取遠(yuǎn)程地址需要使用到關(guān)鍵方法 GetResponseResult ,具體可以參考我的文章
《C# 實(shí)現(xiàn)訪問 Web API Url 提交數(shù)據(jù)并獲取處理結(jié)果》
關(guān)鍵代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" ValidateRequest="FALSE" %> <script language="C#" runat="server"> void Page_load(Object sender, EventArgs e) { if (Page.IsPostBack) { return; } WebService ws = new WebService(); string rv = ws.GetResponseResult("https://hao.360.com/?a1004", Encoding.UTF8, "GET", ""); _rv.Text = rv; } </script>
訪問的關(guān)鍵 URL 地址為 https://hao.360.com/?a1004 ,獲取到的網(wǎng)頁數(shù)據(jù)將存儲(chǔ)到 rv 字符串變量里。
前端代碼
前端代碼主要放置了 today (今天) 和 tomorrow (明天) 的 DIV 容器,另外 id 為 “_rv” 的 Label 控件接受服務(wù)返回的遠(yuǎn)程網(wǎng)頁數(shù)據(jù)。另外,網(wǎng)頁背景設(shè)置為透明色,以方便嵌入到其它網(wǎng)頁應(yīng)用中。
代碼如下:
<html> <head> <style type="text/css" > span { color:Silver; text-shadow:1px 1px 1px #000; } em { color:Silver; text-shadow:1px 1px 1px #000; background-color:#4169E1; padding:2px; } </style> </head> <body style="background-color:transparent"> <form runat="server"> <asp:label ID="_rv" style="display:none" runat="server"></asp:label> <div id="Div1" style="display:flex;width:170px;align-items:center"> <div id="today" style="display:flex;width:50%;align-items:flex-end"></div> <div id="tomorrow" style="display:flex;width:50%;align-items:flex-end"></div> </div> </form> </body> </html>
JavaScript 實(shí)現(xiàn)
結(jié)合 JS 計(jì)算獲取的 DOM 對(duì)象,分析代碼并截取需要的天氣信息,放置到前端容器中進(jìn)行顯示,代碼如下:
<script language="javascript"> window.onload = function () { document.getElementById('weather-change').click(); window.setTimeout(function () { document.getElementById('weather-prov').length = 0; document.getElementById('weather-city').length = 0; document.getElementById('weather-town').length = 0; var newOption = new Option("天津", "03"); document.getElementById('weather-prov').appendChild(newOption); var newOption = new Option("天津", "0103"); document.getElementById('weather-city').appendChild(newOption); var newOption = new Option("天津", "101030100"); document.getElementById('weather-town').appendChild(newOption); document.querySelector("[class*='done v2']").click(); window.setTimeout(function () { document.getElementById('today').innerHTML = document.querySelector(".weathertoday").innerHTML; document.getElementById('tomorrow').innerHTML = document.querySelector(".weathertomorrow").innerHTML; window.parent.document.getElementById('desktoploading').style.display = 'none'; }, 1000); }, 3000); } </script>
總結(jié)
JavaScript 代碼中顯示的為指定城市的信息和今明兩天簡要信息,我們可以繼續(xù)分析 DOM 對(duì)象來獲取更多想要的信息,代碼在窗口加載完成后使用了模擬點(diǎn)擊和延時(shí)獲取數(shù)據(jù)信息的方法,以提升獲取信息的成功率。
代碼這里僅供測(cè)試使用,歡迎大家評(píng)論指教!
到此這篇關(guān)于C# 結(jié)合 Javascript 測(cè)試獲取天氣信息的文章就介紹到這了,更多相關(guān)C# 獲取天氣信息內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
C#不提升自己程序的權(quán)限實(shí)現(xiàn)操作注冊(cè)表
這篇文章主要介紹了C#不提升自己程序的權(quán)限實(shí)現(xiàn)操作注冊(cè)表的相關(guān)資料,需要的朋友可以參考下2022-12-12C#中面向?qū)ο缶幊虣C(jī)制之繼承學(xué)習(xí)筆記
這篇文章主要介紹了C#中面向?qū)ο缶幊虣C(jī)制之繼承學(xué)習(xí)筆記,本文給出一個(gè)簡單子實(shí)例講解C#中的繼承,并講解了一些C#繼承的知識(shí)技巧,需要的朋友可以參考下2015-01-01C#實(shí)現(xiàn)Oracle批量寫入數(shù)據(jù)的方法詳解
往數(shù)據(jù)庫批量寫入數(shù)據(jù),這個(gè)功能使用頻率相對(duì)還是比較高的,特別是在做一些導(dǎo)入等功能的時(shí)候。本文為大家介紹了C#實(shí)現(xiàn)Oracle批量寫入數(shù)據(jù)的方法,需要的可以參考一下2022-11-11winform中寫app.config文件時(shí)調(diào)試情況下沒有改變的原因
讀取很簡單基本都用過 ConfigurationManager.AppSettings[""].ToString() 寫config不是很常用2013-02-02C#如何將List<string>轉(zhuǎn)換為List<double>
這篇文章主要介紹了C#如何將List<string>轉(zhuǎn)換為List<double>問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-07-07C# DataGridView中實(shí)現(xiàn)勾選存儲(chǔ)數(shù)據(jù)和右鍵刪除數(shù)據(jù)(示例代碼)
這篇文章主要介紹了C# DataGridView中實(shí)現(xiàn)勾選存儲(chǔ)數(shù)據(jù)和右鍵刪除數(shù)據(jù)的示例代碼,通過示例代碼給大家展示運(yùn)行效果圖,需要的朋友可以參考下2021-07-07C# datagridview、datagrid、GridControl增加行號(hào)代碼解析
今天這篇文章小編就來給大家分享關(guān)于C# datagridview、datagrid、GridControl增加行號(hào)的介紹,主要包括WinForm中datagridview增加行號(hào)、WPF中datagrid增加行號(hào)、WPF dev控件GridControl增加行號(hào)三個(gè)內(nèi)容,感興趣等我小伙伴可以參考一下2021-10-10