整合營(yíng)銷(xiāo)服務(wù)商

          電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理

          免費(fèi)咨詢(xún)熱線(xiàn):

          HTML學(xué)習(xí)心得

          avaScript和Java有什么聯(lián)系

          根據(jù)目前我自己的理解,不要被名字有相似字節(jié)所欺騙,這兩個(gè)語(yǔ)言其實(shí)沒(méi)有什么聯(lián)系,如果說(shuō)有的話(huà),應(yīng)該就是關(guān)鍵字和對(duì)象的一些范疇有點(diǎn)相似或者說(shuō)是有種模仿的感覺(jué)。但是實(shí)際上一個(gè)作為腳本的輕量語(yǔ)言[^7],一個(gè)作為有完整體制的大型語(yǔ)言[^8],兩者是沒(méi)有任何可比性的。

          JS的內(nèi)鏈外鏈

          內(nèi)鏈

          ? JS的內(nèi)鏈,也就是在html文件內(nèi)的調(diào)用使用與css類(lèi)似,也有兩種方式,即在html文件的<head></head>中書(shū)寫(xiě)使用或是在<body></body>中使用。

          <head></head>內(nèi)書(shū)寫(xiě)

          ? 在<head></head>中對(duì)JS的代碼進(jìn)行書(shū)寫(xiě)時(shí),我們使用<script></script>對(duì)我們的JS代碼進(jìn)行包裹,與html及CSS的法則一樣,其作用也是用來(lái)標(biāo)明其JS的代碼塊屬性。

          <!DOCTYPE html>

          <html>

          <head>

          <meta charset="utf-8">

          <title>test</title>

          <script>

          function displayDate(){

          document.getElementById("demo").innerHTML=Date();

          }

          </script>

          </head>

          <body>

          <h1>我的第一個(gè) JavaScript 程序</h1>

          <p id="demo">這是一個(gè)段落</p>

          <button type="button" onclick="displayDate()">顯示日期</button>

          </body>

          </html>

          ###### <body></body>內(nèi)書(shū)寫(xiě)

          ? 與在<head></head>中類(lèi)似的,我們?cè)?lt;body></body>中對(duì)JS的書(shū)寫(xiě)和使用同樣是在<script></script>中實(shí)現(xiàn),其作用也與上述的一致。

          <!DOCTYPE html>

          <html>

          <body>

          <script>

          document.write("<h1>This is a heading</h1>");

          document.write("<p>This is a paragraph.</p>");

          </script>

          </body>

          </html>

          外鏈

          與css有些不同的,JS的外鏈同樣使用的是<script></script>標(biāo)簽來(lái)實(shí)現(xiàn)。JS即可以出現(xiàn)本地的JS文件的鏈接,也可以調(diào)用網(wǎng)上的JS文件進(jìn)行鏈接,但調(diào)用網(wǎng)絡(luò)上的文件有可能會(huì)受到目標(biāo)文件服務(wù)器和網(wǎng)絡(luò)的影響,使用的頻率沒(méi)有本地的調(diào)用高。

          ? 調(diào)用本地JS文件:

          <!DOCTYPE html>

          <html>

          <head>

          <script type="text/javascript" src="../js/js_for_Seat_selection_nterface.js" ></script>

          </head>

          <body>

          </body>

          </html>

          調(diào)用網(wǎng)絡(luò)的JS文件:

          <!DOCTYPE html>

          <html>

          <head>

          <script src="http://www.lanrenzhijia.com/ajaxjs/jquery.min.js"> </script>

          </head>

          <body>

          </body>

          </html>

          ? JS的外鏈與css類(lèi)似的,也可以在同個(gè)文件里調(diào)用多個(gè)JS文件使用。其中還有很多較css的相似部分就不在這里重復(fù)說(shuō)了,可以參考之前的css部分內(nèi)容。

          JS的語(yǔ)法關(guān)鍵字

          JS的語(yǔ)法關(guān)鍵字有很多很多,因?yàn)镴S是一門(mén)以對(duì)象為基礎(chǔ)的語(yǔ)言,我們?cè)谑褂脮?huì)發(fā)現(xiàn)很多例如document.getElementById("demo").innerHTML=x;的語(yǔ)句,這里的getElementById(),innerHTML其實(shí)都是JS為我們已經(jīng)封裝(可以理解為打包)好了的方法和方法中的參數(shù)。所以我們?cè)谶@里主要介紹一些基本的關(guān)鍵字。

          function

          function的作用其實(shí)很簡(jiǎn)單,就是聲明一個(gè)函數(shù),表明我這里的是一個(gè)函數(shù),我們用一個(gè)看例子來(lái)看:

          function myFunction(){

          var x="";

          var time=new Date().getHours();

          if (time<20){

          x="Good day";

          }

          document.getElementById("demo").innerHTML=x;

          }

          上述的例子就是為我們聲明了一個(gè)叫做myFunction的的函數(shù),其后的花括號(hào)中包含的就是函數(shù)中的內(nèi)容。

          var

          在JS中,var的作用就是聲明一個(gè)變量,在JS中,對(duì)于變量的類(lèi)型沒(méi)有嚴(yán)格的規(guī)定,所以JS也是一門(mén)弱語(yǔ)言,被定義的變量只有在第一次被賦值時(shí)才會(huì)被系統(tǒng)分配相應(yīng)數(shù)據(jù)類(lèi)型的空間。

          var a;

          a=10;

          但實(shí)際上我們會(huì)發(fā)現(xiàn),在實(shí)際使用時(shí)不僅僅是var可以聲明一個(gè)變量,$也可以成功聲明一個(gè)變量,甚至不需要任何的申明關(guān)鍵字也可以直接創(chuàng)建一個(gè)變量。但實(shí)際上是有非常大的差別的,$是JQ中的一個(gè)已經(jīng)過(guò)定義的自定義函數(shù)名,而在單純的JS中是沒(méi)有任何意義的,一般是在你的文件已經(jīng)引入了一個(gè)JQ數(shù)據(jù)庫(kù)后才出現(xiàn)$也可以創(chuàng)建變量的情況,而相較于不使用任何關(guān)鍵字而直接創(chuàng)建一個(gè)變量,其實(shí)質(zhì)是在整個(gè)JS文件的最上層windows中創(chuàng)建了一個(gè)對(duì)象屬性,詳細(xì)的解釋我會(huì)在文末提供一個(gè)網(wǎng)絡(luò)來(lái)源的博客地址,其中對(duì)創(chuàng)建對(duì)象屬性有一個(gè)較為詳細(xì)的解釋。

          所以我們?cè)诼暶鲃?chuàng)建變量時(shí)一定要使用var關(guān)鍵字,不使用任何關(guān)鍵字創(chuàng)建變量,雖然可行,但卻存在著語(yǔ)法錯(cuò)誤。

          new

          與其它的面向?qū)ο蠓椒ㄒ粯拥模琂S中創(chuàng)建對(duì)象所使用的個(gè)關(guān)鍵字也是new,我們通過(guò)它來(lái)創(chuàng)建一個(gè)對(duì)象。

          person=new Object();

          在上述的例子中,我們創(chuàng)建了一個(gè)名為person的對(duì)象,object我們?cè)谶@里可以簡(jiǎn)單的理解為一個(gè)類(lèi)型為對(duì)象的數(shù)據(jù)結(jié)構(gòu)。這句代碼的意思就是創(chuàng)建一個(gè)對(duì)象,對(duì)象名為person

          JS的結(jié)構(gòu)語(yǔ)句

          其實(shí)說(shuō)是JS的結(jié)構(gòu)語(yǔ)句,我們不難發(fā)現(xiàn)的,這些結(jié)構(gòu)語(yǔ)句其實(shí)很多都是我們?cè)谄渌Z(yǔ)言中也能見(jiàn)到的語(yǔ)言語(yǔ)法,我們?cè)谶@里也是將它們簡(jiǎn)單的歸類(lèi)再來(lái)說(shuō)明一下。

          ###### if else

          if else語(yǔ)句主要的作用其實(shí)也很簡(jiǎn)單,就是做一個(gè)判斷,就像它的翻譯 一樣——如果….就….. 否則…..。

          if(...){

          ...

          }

          else{

          ....

          }

          ? 上述的就是它的基本格式,我們可以看到在if后面的小括號(hào)中會(huì)有一個(gè)判斷語(yǔ)句,其中的語(yǔ)句用來(lái)判斷真假來(lái)控制語(yǔ)句的執(zhí)行部分。花括號(hào)中的就是滿(mǎn)足條件時(shí)執(zhí)行的語(yǔ)句。

          這一條語(yǔ)句是可以嵌套的,我們通過(guò)對(duì)它的嵌套來(lái)進(jìn)行多層的判斷。

          if(...){

          if(...){

          ...

          }

          else{

          ....

          }

          }

          else{

          ....

          }

          while

          我們先來(lái)看它的格式:

          while(...){

          ...

          }

          while是一個(gè)循環(huán)語(yǔ)句,在關(guān)鍵字后面的小括號(hào)中,也同樣是一條判斷語(yǔ)句,用來(lái)控制循環(huán)的執(zhí)行。在花括號(hào)中是我們的循環(huán)內(nèi)容。

          do while

          可能我們會(huì)發(fā)現(xiàn),這條語(yǔ)句和上一條語(yǔ)句非常的相似,我們還是先來(lái)看它的格式:

          do{

          ...

          }while(...)

          它一樣是一條控制循環(huán)的語(yǔ)句,不過(guò)和上一個(gè)語(yǔ)句有所區(qū)別的,它是先循環(huán)后判斷,而while是先判斷后循環(huán),有的時(shí)候我們?cè)诓灰匝源蟾缜闆r下使用會(huì)達(dá)到不一樣的效果。

          for

          js for( var i=0;1<=10;i++){ ... }

          for語(yǔ)句也同樣是一個(gè)循環(huán)語(yǔ)句,我們?cè)谏厦媾e出了一個(gè)實(shí)例,從例子中我們看到,for和它的循環(huán)語(yǔ)句是有區(qū)別的,我們需要在判斷的語(yǔ)句中定義變量,規(guī)定執(zhí)行循環(huán)的條件,及控制循環(huán)的條件變化。

          但實(shí)際上,有些時(shí)候我們只需要寫(xiě)明控制循環(huán)的條件語(yǔ)句就可以了,其他的兩條語(yǔ)句可以不在括號(hào)中寫(xiě)出。但要注意的,我們需要保留它的分號(hào),不然會(huì)出現(xiàn)語(yǔ)法錯(cuò)誤。

          switch

          js switch(...){ case '...': ...;break; case '...': ...;break; .... default:...; }

          這是一個(gè)條件選擇語(yǔ)句,我們通過(guò)判斷語(yǔ)句來(lái)選擇到一個(gè)具體的分支,執(zhí)行相應(yīng)的語(yǔ)句。

          有關(guān)于break,default 的作用,我們就不細(xì)說(shuō)了,大家可以去網(wǎng)上查看它的詳細(xì)信息。

          JS的效果實(shí)現(xiàn)(HTML的事件響應(yīng))

          我們已經(jīng)很簡(jiǎn)單的介紹了一下JS的語(yǔ)法和關(guān)鍵字,那么我們下面來(lái)說(shuō)在網(wǎng)頁(yè)中如何觸發(fā)JS的代碼,又或者說(shuō)是如觸發(fā)相應(yīng)的事件。

          ##### 點(diǎn)擊事件

          點(diǎn)擊事件就是通過(guò)頁(yè)面點(diǎn)擊觸發(fā)的事件,我們要注意的,在網(wǎng)頁(yè)中其實(shí)不是只有按鈕才可以作為點(diǎn)擊事件的載體,基本上所有的網(wǎng)頁(yè)元素都可以作為點(diǎn)擊事件的載體。也就是說(shuō)其實(shí)我們可以在任意一個(gè)元素中添加一個(gè)點(diǎn)擊事件。

          ? 下面我們來(lái)看常用的格式:

          <html>

          <body>

          <input type="checkbox" name="ticket_seat"id="tucket_18" class="ticket_input"value="18"onclick="ticket_onclick()">

          <script>

          function ticket_onclick(){

          ...

          }

          </script>

          </body>

          </html>

          ? 在上述的例子中我們可以看到,在標(biāo)簽中加入一個(gè)onclick屬性,在后面寫(xiě)上要觸發(fā)的函數(shù)名。這樣我們?cè)邳c(diǎn)擊網(wǎng)頁(yè)上的元素之后,我們就可以觸發(fā)相應(yīng)的JS函數(shù)。

          對(duì)于我們的onclick字段,我們可以像常規(guī)的函數(shù)調(diào)用來(lái)看待它,也就是說(shuō),我們也是可以通過(guò)它向函數(shù)傳入?yún)?shù)。

          后記:對(duì)于大部分轉(zhuǎn)行的人來(lái)說(shuō),找機(jī)會(huì)把自己的基礎(chǔ)知識(shí)補(bǔ)齊,邊工作邊補(bǔ)基礎(chǔ)知識(shí),真心很重要。

          "我們相信人人都可以成為一個(gè)IT大神,現(xiàn)在開(kāi)始,選擇一條陽(yáng)光大道,助你入門(mén),學(xué)習(xí)的路上不再迷茫。這里是北京尚學(xué)堂,初學(xué)者轉(zhuǎn)行到IT行業(yè)的聚集地。"

          TML+CSS學(xué)完好久了,一直沒(méi)啥時(shí)間總結(jié),現(xiàn)在總結(jié)了下學(xué)的過(guò)程:

          之所以放在一起總結(jié),是因?yàn)镠TML和CSS沒(méi)有啥很多的編程邏輯,都是需要去記住并且熟練使用的,熟練使用是得去一個(gè)個(gè)敲過(guò)一遍。所謂的代碼量積累好像就是這么回事,只有多敲才能會(huì)。

          小白用的嗶哩嗶哩上的教程視頻,因?yàn)閭€(gè)人學(xué)習(xí)方法的原因,都是跟著那教程去敲的,當(dāng)然課后練習(xí)的話(huà),都是自己先摸索敲了一遍在去看的講解,小白覺(jué)得這樣可以加深印象。

          還有就是沒(méi)有熟練之前要天天的去練,哪怕一天半小時(shí)也好。因?yàn)橐坏┮惶鞗](méi)有練就會(huì)忘掉,還得回去找之前的筆記來(lái)看。(因?yàn)橛惺碌R了兩三天沒(méi)去學(xué),結(jié)果又重頭的看了一遍,血淋淋的學(xué)習(xí)效率教訓(xùn)。不管怎樣,貴在堅(jiān)持。)

          當(dāng)然,因?yàn)樾“谆A(chǔ)是真的差,沒(méi)有什么教程是可以完完全全都講完的,使用小白看完了嗶哩嗶哩的教程又跑去了網(wǎng)易云課堂找了一份HTML+CSS的教程來(lái)看,為的是查漏補(bǔ)缺。

          有一種播放叫做1.5倍播放。看的過(guò)程,別跟播放器里一倍的速度看,調(diào)成1.5倍或是2.0倍播放速度,因?yàn)槟切〇|西,多數(shù)都是理解使用的。哪怕忘了,百度一下就可以直接搞定了。打基礎(chǔ)階段所以還是記住熟練使用才好。

          HTML小白也就看了兩天吧,用了半天做了下練習(xí);CSS對(duì)于零基礎(chǔ)的人來(lái)說(shuō)建議12-15天,當(dāng)然小白之前有過(guò)這些概念,所以用了五天多點(diǎn)的時(shí)間。JS才剛剛開(kāi)始學(xué),所以不知道時(shí)間怎么算才好。因?yàn)榍岸巳蠡篐TML+CSS+JS,HTML+CSS學(xué)習(xí)所使用的時(shí)間占比才百分之五,剩下的百分之九十五都是JS的學(xué)習(xí)時(shí)間。

          找課程時(shí)記住,找一兩個(gè)課程,一個(gè)全心去學(xué),一個(gè)查漏補(bǔ)缺就好,別一會(huì)兒這個(gè)課程看一下,那個(gè)課程看一下的。這樣子反而會(huì)使自己心浮氣躁沒(méi)法靜下心來(lái)去學(xué)。打基礎(chǔ)的視頻教程,其實(shí)都一樣的,沒(méi)啥有特別好的特別壞的。

          tml是一種標(biāo)記語(yǔ)言,準(zhǔn)確地來(lái)說(shuō)應(yīng)該是超文本標(biāo)記語(yǔ)言。什么叫標(biāo)記語(yǔ)言呢?

          很多諜戰(zhàn)電視劇里面經(jīng)常有這樣的橋段:要刺殺一個(gè)很重要的人物需要一個(gè)組織內(nèi)部的很多人來(lái)配合完成,A負(fù)責(zé)監(jiān)視并傳達(dá)信息給B,B在收到信息后判斷是否對(duì)目標(biāo)進(jìn)行刺殺。比如A傳遞信息的手段是做標(biāo)記,在某面墻上畫(huà)個(gè)圓圈代表可以動(dòng)手。畫(huà)個(gè)叉代表時(shí)機(jī)不成熟,不能動(dòng)手。畫(huà)個(gè)方塊,代表情況不明需要進(jìn)一步監(jiān)視探明情況。B在看到標(biāo)記后就知道是什么意思。這就是標(biāo)記,標(biāo)記代表一定的意思,也可以稱(chēng)呼為標(biāo)記語(yǔ)言。

          那什么又是超文本呢?看其字知其意,就是超越文本。我們一般傳遞意思大部分都是文字,說(shuō)話(huà)說(shuō)的都是文字,寫(xiě)信一般也全是用文字來(lái)表述意思。超文本不光有文字,它還包括圖片、鏈接甚至是音樂(lè)和程序等非文字的元素。

          發(fā)微信消息就可以體會(huì)出來(lái),除了發(fā)文字我們也會(huì)發(fā)圖片,甚至斗圖。如果有好聽(tīng)的音樂(lè)也可以分享給好友聽(tīng)。如果你還懂程序的話(huà),你也可以發(fā)給好友。

          Html既然是一種超文本標(biāo)記語(yǔ)言,可想而知它里面包含的標(biāo)記應(yīng)該有很多。每個(gè)標(biāo)記代表一個(gè)意思,用不同比較組合起來(lái)就可以表達(dá)一整串完整的意思。



          比如說(shuō)這個(gè),四個(gè)標(biāo)記可以完整表達(dá)一個(gè)成語(yǔ)的意思。猜猜是什么成語(yǔ)吧。


          在動(dòng)手開(kāi)始寫(xiě)hmtl標(biāo)記之前,我們需要一點(diǎn)準(zhǔn)備。

          1. 在你的電腦桌面新建一個(gè)記事本。


          注意記事本的后綴名(也就是圖中最后面的.txt)必須要有,如果沒(méi)有這個(gè)要調(diào)出來(lái)。

          我的電腦是win10系統(tǒng)的,以下以win10系統(tǒng)為例。其他系統(tǒng)的可以百度自行搜索。

          調(diào)的步驟為:1)打開(kāi)我的電腦



          2)選擇查看

          3)勾選文件擴(kuò)展名

          調(diào)整完成后,以后再新建記事本就會(huì)看到擴(kuò)展名了。

          2. 打開(kāi)記事本,在里面寫(xiě)一個(gè)標(biāo)記<a href="http://www.baidu.com">百度</a>


          注意:<a></a> 這個(gè)就是html眾多標(biāo)記中的一個(gè)標(biāo)記,我們叫做a標(biāo)記,這個(gè)<a>叫a標(biāo)記的開(kāi)始,這個(gè)</a>叫做a標(biāo)記的結(jié)束。他們兩個(gè)是天生一對(duì)。href=”http://www.baidu.com”,這個(gè)就是百度的網(wǎng)址,只有寫(xiě)了這個(gè),才知道是要去百度,你要不寫(xiě),那誰(shuí)知道你要去哪里呢。當(dāng)然這個(gè)網(wǎng)址你也可以改成騰訊或者是新浪的網(wǎng)址。


          3. 將記事本的txt后綴名改為html。(我這里不光改了后綴名,也將新建文本文檔改為了index)。



          注意,你改完以后的圖標(biāo)可能和我的不一樣,這是因?yàn)槲野惭b的是360瀏覽器,你安裝是其他瀏覽器,所以不一樣。不一樣是正常的。

          4. 雙擊打開(kāi)這個(gè)文件。



          雙擊打開(kāi)以后,我會(huì)看到兩個(gè)帶下劃線(xiàn)的字——百度。

          5. 點(diǎn)擊百度兩個(gè)字,我們就可以跳轉(zhuǎn)到百度官網(wǎng)了。






          總結(jié):

          1.本文粗略介紹了超文本標(biāo)記語(yǔ)言的意思

          2.動(dòng)手實(shí)踐寫(xiě)了一個(gè)a標(biāo)記

          3.實(shí)踐之前的一些準(zhǔn)備(新建記事本,改后綴名)

          4.具體介紹了a標(biāo)記的寫(xiě)法,里面包含一個(gè)href(用來(lái)寫(xiě)網(wǎng)址的地方)


          編程最重要的是動(dòng)手,看是看不會(huì)的,很多人都是看得特別明白,以為自己已經(jīng)會(huì)了,但是一動(dòng)手大腦就一片空白。什么也寫(xiě)不出來(lái)。所以編程最重要的就是要?jiǎng)邮郑瑒?dòng)手一遍強(qiáng)過(guò)看明白十遍。一定要?jiǎng)邮肿鲆槐椤?/span>


          Ps:a標(biāo)記一般也叫做a標(biāo)簽,一般我們習(xí)慣叫做a標(biāo)簽。


          有什么不懂的地方,可以留言咨詢(xún)。


          主站蜘蛛池模板: 在线观看国产一区亚洲bd| 亚洲乱码一区二区三区国产精品| 无码人妻久久一区二区三区| 亚洲香蕉久久一区二区| 国产精品一区三区| 欧美av色香蕉一区二区蜜桃小说 | 精品成人av一区二区三区| 亚洲中文字幕久久久一区| 久久国产一区二区| 国产vr一区二区在线观看| 国产一区二区三区樱花动漫| 在线播放一区二区| 亚洲一区二区电影| 国产精品va无码一区二区| 国产精品第一区第27页| 精彩视频一区二区三区| 国产精品538一区二区在线| 国模精品视频一区二区三区| 亚洲AV日韩综合一区| 亚洲国产成人久久一区二区三区 | 日韩电影在线观看第一区| 无码人妻精品一区二区三区不卡| 国产乱码一区二区三区| 亚洲一本一道一区二区三区| 无码人妻一区二区三区免费手机 | 国产日韩一区二区三区在线播放| 日韩免费无码一区二区三区 | 国产综合一区二区| 久久国产精品一区二区| 免费无码毛片一区二区APP| 无码少妇一区二区| 国产成人精品日本亚洲专一区 | 人妻少妇一区二区三区| 亚洲一区二区三区AV无码| 国产亚洲一区二区三区在线| 无码精品一区二区三区免费视频| 色噜噜狠狠一区二区三区果冻| 99久久综合狠狠综合久久一区| 国产主播福利一区二区| 波多野结衣在线观看一区| 国产一区在线视频|