成果形式：實(shí)踐報(bào)告成果名稱：Python爬蟲與網(wǎng)頁設(shè)計(jì)-23-實(shí)踐活動題目校內(nèi)華為大數(shù)據(jù)項(xiàng)目實(shí)訓(xùn)一、實(shí)踐目的1.了解并掌握Python語言的基本語法，并會自己用Python語言寫一些簡單的程序代碼；2.學(xué)會用Python進(jìn)行簡單的爬蟲；3.學(xué)會用html創(chuàng)建各式各樣的網(wǎng)頁，例如：人人網(wǎng)登錄界面，京東界面，淘寶界面，QQ登錄界面；二、實(shí)踐內(nèi)容Python語言基本內(nèi)容：Python基礎(chǔ)（1）代碼格式強(qiáng)制縮進(jìn)！Python開發(fā)者有意讓違反了縮進(jìn)規(guī)則的程序不能通過編譯，以此來強(qiáng)制程序員養(yǎng)成良好的編程習(xí)慣。并且Python語言利用縮進(jìn)表示語句塊的開始和退出（Off-side規(guī)則），而非使用花括號或者某種關(guān)鍵字。增加縮進(jìn)表示語句塊的開始，而減少縮進(jìn)則表示語句塊的退出?？s進(jìn)成為了語法的一部分。（2）根據(jù)PEP的規(guī)定，必須使用4個(gè)空格來表示每級縮進(jìn)。2.基本語法弱類型變量必須先賦值再使用小心引用！2和3的常見差異xrangeprint數(shù)據(jù)類型統(tǒng)一，取消unicode和longutf8:3.x代碼默認(rèn)utf-83.顯示保留字保留字是Python語言中已經(jīng)被賦予特定意義的一些單詞，開發(fā)程序時(shí)，不可以把這些保留字作為變量，函數(shù)，類，模塊和其他對象的名稱來使用。在Python中有查看關(guān)鍵字的模塊，我們導(dǎo)入keyword的模塊，將關(guān)鍵字列表打印出來顯示結(jié)果：4.關(guān)鍵字賦值錯(cuò)誤5.標(biāo)識符標(biāo)識符：可以理解為一個(gè)名字，它主要用來標(biāo)識變量，函數(shù)，類，模塊和其他對象名稱?；疽?guī)則：由字母，下劃線和數(shù)字組成，并且第一個(gè)字符不能是數(shù)字，可以使用的標(biāo)識符字符有：a-z，A-Z，0-9，“_”如：USERID，book，user_id，myclass，book01注意事項(xiàng)：（1）不能是Python的保留字（2）不能包含空格，@，%，$（3）可以中文，但是我們不建議使用中文（4）嚴(yán)格區(qū)分大小寫錯(cuò)誤的標(biāo)識符：4word，class，@book，userid下劃線開頭Python中用下劃線開頭的標(biāo)識符都有特殊的意義，在使用的時(shí)候要特別注意。如：單下劃線開頭表示不能直接訪問的屬性；雙下劃線開頭表示類的私有成員；雙下劃線開頭，雙下劃線結(jié)尾是Python專用標(biāo)識符；“__init()__”表示構(gòu)造函數(shù)。6.數(shù)據(jù)類型（1）數(shù)值類型分為：整數(shù)和小數(shù)整數(shù)包括正整數(shù)，負(fù)整數(shù)，0，并且它的位數(shù)是任意的浮點(diǎn)數(shù)由整數(shù)部分和小數(shù)部分組成，主要用于處理包括小數(shù)的數(shù)。（2）字符串類型字符串就是連續(xù)的字符序列，可以是計(jì)算機(jī)所能表示的一切字符集合。字符串屬于不可變序列，通常使用單引號‘’或者雙引號“”或者三引號‘’‘’‘’或“”“”“”括起來，這三種引號形式再語義上沒有差別，只是再形式上有差別。其中單引號和雙引號的字符串序列必須再一行上，而三引號內(nèi)的字符序列可以分布再連續(xù)的多行上。（3）布爾類型布爾類型主要用來表示真或者假的值。標(biāo)識符True和False被解釋為布爾值。布爾值可以轉(zhuǎn)化為數(shù)值，其中True表示1，而False表示0False或None數(shù)值中的零，包括0，0.0，虛數(shù)0空序列，包括字符串，空元組，空列表，空字典自定義的對象的實(shí)例，該對象的__bool__方法返回False，或者_(dá)_len__方法返回07.運(yùn)算符算術(shù)運(yùn)算符+ 加- 減* 乘/ 除% 求余// 取整除#返回商的整數(shù)部分** 冪#返回x的y次方注意：（1）運(yùn)算符*還可以使用字符串中，計(jì)算結(jié)果就是字符串重復(fù)指定次數(shù)的結(jié)果（2）使用/和//運(yùn)算符和%運(yùn)算符時(shí)，除數(shù)不能為0，否則會出現(xiàn)異常賦值運(yùn)算符= 賦值運(yùn)算+= 加賦值-= 減賦值*= 乘賦值/= 除賦值%= 取余數(shù)賦值**= 冪賦值//= 取整除賦值比較運(yùn)算符> 大于< 小于== 等于!= 不等于>= 大于等于<= 小于等于邏輯運(yùn)算符and 邏輯與or 邏輯或not 邏輯非短路效果andor位運(yùn)算符& 位與| 位或^ 異或~ 取反<< 左移>> 右移用Python進(jìn)行網(wǎng)絡(luò)爬蟲:步驟一：python的下載（1）首先，進(jìn)入到python官網(wǎng)，你可以直接輸入python主頁，也可以從百度搜索框進(jìn)入到python的主頁，這里方法很多，我不在一一例舉了，然后在主頁上面可以看見Downloads字樣，點(diǎn)擊下載，然后跳轉(zhuǎn)出下載界面。下載界面（2）跳轉(zhuǎn)出python下載界面，選擇一個(gè)版本進(jìn)行下載，python2.7的支持包要更加全面完善，python3的包擴(kuò)展可能比較少，但是正在慢慢開發(fā)；python2.7預(yù)計(jì)在202X停止更新了；這里我選擇的是2.7版本。選擇版本（3）安裝好后，按windows鍵加R鍵，彈出運(yùn)行窗口，在運(yùn)行窗口輸入cms進(jìn)入到命令行界面，然后輸入python，如果安裝成功，即可進(jìn)入到python交互界面，如果沒有則表示python沒有安裝成功。步驟二：爬蟲準(zhǔn)備（1）爬蟲首先需要做的事情就是要確定好你想要爬取數(shù)據(jù)的對象，以百度主頁logo圖片的地址為例。百度界面（2）首先，是打開百度主頁界面，然后把鼠標(biāo)移動到主頁界面的百度logo圖標(biāo)上面，點(diǎn)擊鼠標(biāo)右鍵，然后點(diǎn)擊審查元素，即可打開開發(fā)者界面。（3然后再下面的界面里面，可以看到該logo圖標(biāo)在HTML里面的排版模式，<imghidefocus="true"src="http://baidu/img/bd_logo1.png"width="270"height="129">開發(fā)者界面步驟三：開始爬蟲爬蟲主要分為兩個(gè)部分，第一個(gè)是網(wǎng)頁界面的獲取，第二個(gè)是網(wǎng)頁界面的解析；爬蟲的原理是利用代碼模擬瀏覽器訪問網(wǎng)站，與瀏覽器不同的是，爬蟲獲取到的是網(wǎng)頁的源代碼，沒有了瀏覽器的翻譯效果。（1）首先，我們進(jìn)行頁面獲取，python爬蟲的話很多模塊包提供給開發(fā)者直接抓取網(wǎng)頁，urllib，urllib2，requests（urllib3）等等，這里我們使用urllib2進(jìn)行網(wǎng)站頁面的獲取；首先導(dǎo)入urllib2模塊包（該包是默認(rèn)安裝的）：importurllib2；導(dǎo)入urllib2模塊包（2）導(dǎo)入模塊包之后，然后調(diào)用urllib2中的urlopen方法鏈接網(wǎng)站，代碼如下repr=urllib2.urlopen("XXXXXX"),XXXXXX代表的是網(wǎng)站名稱；（3）得到網(wǎng)站的響應(yīng)之后，然后就是將頁面的源代碼讀取出來，調(diào)用read方法，html=repr.read()；調(diào)用read（4）獲取到頁面的源代碼之后，然后接下來的工作就是將自己想要的數(shù)據(jù)從html界面源代碼中解析出來，解析界面的模塊包有很多，原始的re，好用的BeautifulSoup，以及l(fā)xml等等，這里用re介紹介紹，首先導(dǎo)入re模塊包：importre；（5）然后進(jìn)行利用re進(jìn)行搜索；re搜索（6）然后就實(shí)現(xiàn)了一個(gè)簡單的爬蟲流程，打印url，可以看見剛好就是之前看見的百度主頁logo的地址。源代碼：importurllib2repr=urllib2.urlopen("URL")html=repr.read()importre省略一行代碼printurl。用html設(shè)計(jì)網(wǎng)頁認(rèn)識網(wǎng)頁網(wǎng)頁主要由文字，圖像和超鏈接等元素構(gòu)成，當(dāng)然除了這些元素，網(wǎng)頁中還包含音頻，視頻以及Flash等。HTML初識超文本標(biāo)記語言（英語：HyperTextMarkupLanguage，簡稱：HTML）HTML是一種用于創(chuàng)建網(wǎng)頁的標(biāo)準(zhǔn)標(biāo)記語言。網(wǎng)頁文件的后綴是以.html。網(wǎng)頁的形成前端程序員面寫的→瀏覽器的渲染→客戶眼中的美麗頁面4.HTML骨架格式HTML有自己的語言語法骨架格式。<html><head> <title></title></head><body></body></html>5.開發(fā)工具的使用編寫我們的第一個(gè)HTML頁面?。?）打開HBuilderX新建一個(gè)項(xiàng)目；（2）打開index.html；（3）在<body></body>中間寫入：給自己定一個(gè)小目標(biāo)，經(jīng)過5個(gè)月的努力，實(shí)現(xiàn)月薪過萬（4）保存之后；（5）用瀏覽器打開文件。.6.HTML常用標(biāo)簽標(biāo)題標(biāo)簽:h1~h6h1:我要好好學(xué)習(xí)，天天向上h2:我己經(jīng)打開電腦了，我要開始學(xué)習(xí)了h3:我看到了圖標(biāo)在發(fā)光h4：不如等會再學(xué)h5：已經(jīng)到下午了h6：算了明天再學(xué)7.HTML常用標(biāo)簽（1）段落標(biāo)簽:<p>...（2）水平線標(biāo)簽：<hr/>（3）換行標(biāo)簽:<br/>（4）<b></b>或者<strong></strong>字體加粗（5）<i></i>或者<em></em>斜體字（6）<s></s>或者<del></del>字體加刪除線（7）<u></u>或者<ins></ins>字體加下劃線8.標(biāo)簽屬性（1）標(biāo)簽可以擁有多個(gè)屬性，必須寫在開始標(biāo)簽中，位于標(biāo)簽名后面；（2）屬性之間不分先后順序，標(biāo)簽名與屬性、屬性與屬性之間均以空格分開；（3）任何標(biāo)簽的屬性都有默認(rèn)值，省略該屬性則取默認(rèn)值，采取鍵值對的形式，key=“value”的格式。9.圖像標(biāo)簽img單詞縮寫:

image圖像

HTML網(wǎng)頁中任何元素的實(shí)現(xiàn)都要依靠HTML標(biāo)簽，要想在網(wǎng)頁中顯示圖像就需要使用圖像標(biāo)簽，接下來將詳細(xì)介紹圖像標(biāo)簽<img

/>以及和他相關(guān)的屬性。其基本語法格式如下:

該語法中src屬性用于指定圖像文件的路徑和文件名，他是img標(biāo)簽的必需屬性。

<img

src="圖像URL"

/>10.<input>標(biāo)簽<input屬性/>一個(gè)重要的表單元素11.<input>標(biāo)簽的type屬性type屬性：text，password，checkbox，radio，button，submit，reset，image，file<inputreadonly/>控件只讀<inputdisabled/>控件不可用<inputplaceholder=“請輸入姓名"/>都是控件的屬性html5支持12.表單域form<formaction=“提交表單的地址”method=“提交方式”>表單域中的表單元素</form>說明：action的值是一個(gè)提交表單的URL地址，method的值分別是get、post兩種方式13.<label>標(biāo)簽（理解）<labelfor=“id名”>姓名</label>用于綁定一個(gè)表單元素，當(dāng)點(diǎn)擊label標(biāo)簽時(shí)會獲得該表單的焦點(diǎn)我們通過for來綁定表單元素14.下拉菜單<selectname=“菜單名”> <optionvalue=“值”>顯示值</option> <optionvalue=“值”>顯示值</option> <optionvalue=“值”>顯示值</option></select>15.文本域控件<textarea></textarea>文本域如果需要輸入大量信息，就可以通過文本域輕松實(shí)現(xiàn)。cols屬性：每行中的字符數(shù)rows屬性：顯示的行數(shù)16.H5酷炫表單元素<inputtype=“color”>調(diào)色板<inputtype=“date”>生日框<inputtype=“number”>數(shù)量欄17.注釋標(biāo)簽<!--這里寫注釋的內(nèi)容-->注釋標(biāo)簽用來在源文檔中插入注釋。注釋不會在瀏覽器中顯示?？墒褂米⑨寣Υa進(jìn)行解釋，這樣做有助于在以后的時(shí)間對代碼的編輯。特別是代碼量很大的情況下很有用。18.鏈接標(biāo)簽<a><ahref=“目標(biāo)鏈接”>...</a>超鏈接想去哪里點(diǎn)一下錨點(diǎn)定位：<ahref=“#id名”>...</a>跳轉(zhuǎn)到錨點(diǎn)<h3id=“id名”></h3>錨點(diǎn)19.路徑的分類相對路徑以引用文件之網(wǎng)頁所在位置為參考基礎(chǔ)，而建立出的目錄路徑。因此，當(dāng)保存于不同目錄的網(wǎng)頁引用同個(gè)文件時(shí)，所使用的路徑將不相同，故稱之為相對路徑。（1）圖像文件和HTML文件位于同文件夾:只需輸入圖像文件的名稱即可，如<imgsrc-=logo.gif/.（2）圖像文件位于HTML文件的下一級文件夾:輸入文件夾名和文件名，之間用廣隔開，如<imgsrc="img/img01/ogo.gif"1>.（3）圖像文件位于HTML文件的上級文件夾在文件名之前加入廣，如果是上兩級，則需要使用”1.，以此類推，如<imgsc-../o.o.gig1>.絕對路徑絕對路徑以Web站點(diǎn)根目錄為參考基礎(chǔ)的目錄路徑。20.表格表格頭：表頭使用<th></th>代替原來的<td></td>表格標(biāo)題：標(biāo)題使用<caption>標(biāo)題名稱</caption>單元格合并：合并單元格屬性：rowspan豎向跨單元格，colspan橫向跨單元格21.div塊級標(biāo)簽<div></div>定義HTML文檔中的一個(gè)分隔區(qū)塊或者一個(gè)區(qū)域部分常用于組合塊級元素，以便通過CSS來對這些元素進(jìn)行格式化。22.span行級標(biāo)簽<span></span>用于對文檔中的行內(nèi)元素進(jìn)行組合提供了一種將文本的一部分或者文檔的一部分獨(dú)立出來的方式。用html進(jìn)行完整的網(wǎng)頁設(shè)計(jì)：1.確定網(wǎng)站主題（1）分析網(wǎng)站的功能，講網(wǎng)站所有的功能再文檔中體現(xiàn)；（2）?分析網(wǎng)站的主題，選擇符合網(wǎng)站主題的方案。2.搜集材料（1）通過和與網(wǎng)站相關(guān)人員的接觸、交流確定網(wǎng)站需要的模塊，并將這些模塊再文檔中體現(xiàn)；（2）收集相關(guān)圖片、文字、視頻等資料；（3）將圖片、文字和視頻等資料使用相應(yīng)的軟件進(jìn)行編輯備用（必須做）；（4）對圖片、文字和視頻等資料分別分類整理；（5）例如：網(wǎng)站根文件夾下images文件夾存放網(wǎng)頁界面圖片（圖片類型為jpg、jpeg、gif、png），pic文件夾存放照片素材，flash文件夾存放動畫素材；（6）所有素材的文件名都必須是非中文字符，并且要做到看到文件名就知道是哪張圖片。網(wǎng)頁設(shè)計(jì)實(shí)例：人人網(wǎng)登錄界面：<!DOCTYPEhtml><htmllang="en"><head> <metacharset="UTF-8"> <title>人人網(wǎng)注冊</title> </head> <body> <imgsrc="renren_titile.gif"alt=""/><br/> <p>人人網(wǎng)，中國<strong>最真實(shí)、最有效</strong>的社會平臺，加入人人網(wǎng)，找回老朋友，結(jié)交新朋友。</p> 電子郵箱：<inputtype="email"/> <inputtype="submit"value="提交"/><br/><br/> 設(shè)置密碼:<inputtype="password"size="30"maxlength="10"/><br/><br/> 真實(shí)姓名:<inputtype="text"size="30"maxlength="10"/><br/><br/> 性別:<inputtype="radio"name="sex"value="男"checked/>男<inputtype="radio"name="sex"value="女"/>女<br/><br/> 生日:<select> <optionvalue="1990">1990</option> <optionvalue="1991">1991</option> <optionvalue="1992">1992</option> <optionvalue="1993">1993</option> <optionvalue="1994">1994</option> <optionvalue="1995">1995</option> <optionvalue="1996">1996</option> <optionvalue="1997">1997</option> <optionvalue="1998">1998</option> <optionvalue="1999">1999</option> </select>年份 <select> <optionvalue="一月">一月</option> <optionvalue="二月">二月</option> <optionvalue="三月">三月</option> <optionvalue="四月">四月</option> <optionvalue="五月">五月</option> <optionvalue="六月">六月</option> <optionvalue="七月">七月</option> <optionvalue="八月">八月</option> <optionvalue="九月">九月</option> <optionvalue="十月">十月</option> <optionvalue="十一月">十一月</option> <optionvalue="十二月">十二月</option> <select/>月份<br/> <p>為什么要填寫我的生日?<p/> 我現(xiàn)在<select> <optionvalue="請選擇身份"cheched>請選擇身份</option> <optionvalue="醫(yī)生">醫(yī)生</option> <optionvalue="教師">教師</option> <optionvalue="自由職業(yè)">自由職業(yè)</option> <select/>(非常重要）<br/><br/> <imgsrc="renren_code.gif"alt=""/> <ahref="#">看不清，換一張</a><br/><br/> 驗(yàn)證碼：<inputtype="text"size="30"maxlength="10"/><br/><br/> <imgsrc="renren.gif"alt=""/> </body> </html>2.QQ會員<!DOCTYPEhtml><html> <head> <metacharset="utf-8"> <title></title> <styletype="text/css"> #main{ height:100px; background-color:#666666; padding-left:80px; padding-top:10px; } #mainimg{ width:120px; } #mainimg,div{ vertical-align:middle; } #caidan{ display:inline-block; } #caidanul,li{ list-style:none; float:left; margin:8px; margin-right:20px; color:#FFFFFF; } #caidanullia{ text-decoration:none; } #caidanullia:link{ color:#FFFFFF; } #caidanullia:visited{ color:#FFFFFF; } #caidanullia:hover{ color:orange; } #anniu{ display:inline-block; margin:30px; } #anniu#denglu{ display:inline-block; border:1px#E1D5A5solid; width:70px; height:30px; color:#E1D5A5; border-radius:30px; text-align:center; line-height:30px; } #anniu#denglu:hover{ color:black; background:#E1D5A5; } #anniu#huiyuan{ display:inline-block; border:1px#FFA500solid; height:30px; width:120px; text-align:center; line-height:30px; border-radius:40px; color:#8F6809; background:#E1D5A5; margin-left:10px; } </style> </head> <body> <divid="main"> <imgsrc="img/logo.png">; <divid="caidan"> <ul> <li><ahref="#">超級會員</a></li> <li><ahref="#">年費(fèi)專區(qū)</a></li> <li><ahref="#">成長體系</a></li> <li><ahref="#">會員活動</a></li> <li><ahref="#">生活特權(quán)</a></li> <li><ahref="#">游戲特權(quán)</a></li> <li><ahref="#">功能特權(quán)</a></li> </ul> </div> <divid="anniu"> <divid="denglu"> 登陸 </div> <divid="huiyuan"> 開通超級會員 </div> </div> </div> </body></html>3.愛寵知識界面<!DOCTYPEhtml><html> <head> <metacharset="utf-8"> <title></title> <styletype="text/css"> li{ list-style-image:url(../img/tb.gif); line-height:50px; color:blue; background:; border-bottom:1pxblackdashed;//底下加黑色虛線 } div{ width:350px; background-image:url(../img/bg.gif); padding:1.25; margin-top:150px; margin-left:550px; padding:25px25px; border-radius:0px;//改變圓角度數(shù) border:2pxsolidgreen; } a{ text-decoration:none; } ul{ background-color:white; } h3{ color:white; } </style> </head> <body> <div> <h3>愛寵知識</h3> <ahref=""> <ul> <li>養(yǎng)狗比養(yǎng)貓對健康更有利</li> <rb></rb> <li>日本正宗柴犬亮相，你怎么看柴犬</li> <rb></rb> <li>狗狗歌曲《新年旺旺》</li> <rb></rb> <li>帶寵兜風(fēng)，開車帶寵需要注意什么？</li> <rb></rb> <li>【爆笑】這狗狗太不給力了</li> <rb></rb> <li>狗狗與男童相同著裝拍有愛造型照</li> <rb></rb> <li>狗狗各個(gè)階段健康大事件</li> <rb></rb> <li>調(diào)皮寵物狗陷在沙發(fā)里的搞笑瞬間</li> <rb></rb> <li>為什么每次大小便后，會用腳踢土？</li> <rb></rb> </ul></a> </div> </body></html>4.當(dāng)當(dāng)網(wǎng)<!DOCTYPEhtml><html><headlang="en"><metacharset="UTF-8"><title>完善當(dāng)當(dāng)購物車頁面</title><linktype="text/css"rel="stylesheet"href="css/cartStyle.css"/></head><body><divclass="content"><divclass="logo"><imgsrc="images/dd_logo.jpg"><spanonclick="close_plan();">關(guān)閉</span></div><divclass="cartList"><ul><li>￥<inputtype="text"name="price"value="21.90"></li><li><inputtype="button"name="minus"value="-"onclick="minus(0);"><inputtype="text"name="amount"value="1"><inputtype="button"name="plus"value="+"onclick="plus(0);"></li><liid="price0">￥21.90</li><li><ponclick="collection();">移入收藏</p><ponclick="del();">刪除</p></li></ul><ul><li>￥<inputtype="text"name="price"value="24.00"></li><li><inputtype="button"name="minus"value="-"onclick="minus(1);"><inputtype="text"name="amount"value="1"><inputtype="button"name="plus"value="+"onclick="plus(1);"></li><liid="price1">￥24.00</li><li><ponclick="collection();">移入收藏</p><ponclick="del();">刪除</p></li></ul><ol><liid="totalPrice"> </li>