web前端(13)—— 瞭解JavaScript,JavaScript的引入方式

来源:https://www.cnblogs.com/yangva/archive/2018/11/16/9965263.html
-Advertisement-
Play Games

什麼是JavaScript JavaScript的起源 JavaScript的組成 ...


從本篇博文開始,將進入web前端方便最關鍵最重要的部分——javascript,學到後面你就知道它真的太重要了

什麼是JavaScript

JavaScript一種直譯式的腳本語言,是一種動態類型、弱類型、基於原型的語言,內置支持類型,是網際網路上最流行的腳本語言,常常簡稱js

它的解釋器被稱為JavaScript引擎,為瀏覽器的一部分,廣泛用於客戶端的腳本語言,最早是在HTML(標準通用標記語言下的一個應用)網頁上使用,用來給HTML網頁增加動態功能

JavaScript 被數百萬計的網頁用來改進設計、驗證表單、檢測瀏覽器、創建cookies,以及更多的應用

因為你在電腦、手機、平板上瀏覽的所有的網頁,以及無數基於HTML5的手機App,交互邏輯都是由JavaScript驅動的

 

JavaScript的起源

javascript是由Netscape公司的布蘭登-愛奇(Brendan Eich)於1995開發而來。當時並不叫JavaScript,而是livescript。但是當時java巨火,為了蹭熱度取名javascript,但和java沒有任何關係。javascript1.0一經推出,便獲得了巨大成功,Netscape隨後又推出一系列版本。

在當時市面上有三種js版本,IE的JScript,網景的javaScript,scriptEase中的CEnvi。可javascript畢竟是公司開發的,規範性的問題漸漸暴露出來。

最後由EMCA(歐洲電腦製造協會)進行標準化,自此後javascript一統江湖。在2003年以前,javascript有個外號叫“牛皮蘚”,因為網站的什麼彈窗廣告,頁面內置廣告都是用js實現的。2004年開始,谷歌公司開始重視Ajax(非同步請求,不用刷新網站就可以請求局部的數據,比如你註冊或者登陸,如果輸入有誤就會給你提示,但是輸入過的數據還在的,頁面並沒有刷新。這個後面會詳細介紹)。接著2007年,蘋果公司出蘋果手機,那些什麼切水果,憤怒的小鳥之類的游戲就用js實現的(現在的很多手機游戲仍然是用js實現的) 

2010年,推出html5的畫布(canvas標簽)功能,工程師可以在canvas進行游戲製作,如今開始流行webapp,用頁面技術開發手機應用,慢慢的現在越來越適用。

2011年,node.js誕生,使JavaScript能夠開發伺服器程式。

而且js不只是手機游戲,網站小工具之類的,js簡直全棧開發工程師的必學之課,因為js可以寫前端,可以寫介面,可以寫後端(node.js),可以寫操作系統(NodeSO),還可以寫客戶端等等的,反正基本上就沒有js不能插足的事

因為有一句話,凡是能用js解決的問題,最後都會用js來解決

 

JavaScript的組成

  • ECMAScript 5.0:定義了js的語法標準: 包含變數 、表達式、運算符、函數、if語句 for迴圈 while迴圈、內置的函數,說白了就是同任何一門編程語言一樣的語法規則

  • DOM :操作網頁上元素的API,說白了就是html標簽元素。比如讓盒子顯示隱藏、變色、動畫 form表單驗證

  • BOM:操作瀏覽器部分功能的API,說白了就是可以對瀏覽器做相關的控制。比如刷新頁面、前進後退、讓瀏覽器自動滾動

 

JavaScript的引入方式

js的引入方式和css的引入方式類似

 

  • 行內式
  • 外聯式
  • 內部式

 

行內式

 

直接在html標簽元素里添加js的監聽屬性onclick之類的(onclick是什麼目前不用在意,後期會詳細介紹),然後等於一個js函數

 

<p onclick='myjsfunction()'>

</p>

  

外聯式

在html標簽的合適位置添加以下代碼引入

<script type="text/javascript" src= '.....js(js路徑)'>
  
</script>

這裡要註意下,css外鏈引入使用的是link標簽的href屬性,js外鏈引入使用的script標簽的src屬性

內部式

這種方式建議放在html里的body標簽之後,讓所有的dom對象載入完了再運行js代碼

<script type="text/javascript">
  ....(js代碼)
</script>

把上面的代碼放進html文件里即可  

 

 

例:

 

好的,本篇博文暫且介紹到這,下一篇則真正進入js的學習 

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • contentEditable ———————————————————————————————————————————————————————— 功能:允許用戶編輯元素中的內容。 功能說明: 該元素必須是可以獲得滑鼠焦點的元素,而且在點擊滑鼠後要向用戶提供一個插入符號,提示用戶該元素中的內容允許編輯 ...
  • 1、html常用標簽 <pre>...</pre>:標識預定義文本 <a>是anchor的縮寫,<a>標簽定義錨點和超鏈接,<a>常與href屬性連用表示超鏈接連接地址並用target來表示打開文檔的方法:_blank表示在新視窗中打開、_parent表示在父視窗中打開、_self表示在當前視窗中打 ...
  • / Zepto v1.2.0 zepto event ajax form ie zeptojs.com/license / (function (global, factory) { if (typeof define === 'function' && define.amd) define(fun ...
  • 前面說了Bootstrap4的下載和簡單使用,現在我們接著往下學習,Bootstrap4的響應式佈局主要依靠柵格系統來實現的。面老K先來講解一下Bootstrap4的柵格系統,讓你能夠更快的瞭解Bootstrap4.(PS:更詳細的介紹請訪問原K先生的博客) Bootstrap4柵格系統 柵格系統是 ...
  • 有時候,我們需要在實例創建過程中進行一些初始化的工作,以幫助我們完成項目中更複雜更豐富的需求開發,針對這樣的需求,Vue提供給我們一系列的鉤子函數。 vue生命周期 beforeCreate 在實例初始化之後,數據觀測 (data observer) 和 event/watcher 事件配置之前被調 ...
  • 日期插件rolldate.js的使用 下載地址:http://www.jq22.com/jquery-info19834 效果: 代碼: ...
  • 1.起因 在上個項目中,客戶希望時間選擇插件可以是ios風格的那種,但是找了很久,發現並沒有用vue的ios風格時間插件,於是自己便自己造了一個輪子. 2.插件效果 3.插件依賴以及安裝使用 插件依賴於better-scroll和vue,安裝流程如下: 4.源碼查看與調試 可以在我的Github上查 ...
  • 效果圖 (通過js實現對時間處理); 這是時間處理的函數, 代碼註釋說明的也還清楚, 這是文件鏈接,可以直接打開,保存一下 https://blog-static.cnblogs.com/files/yk95/commonFunc.js 頁面數據是自己模擬的 接著頁面中去使用 時間處理的函數 和 假 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...