jQuery安裝與下載
JQuery 是一個javaScript庫,是一個輕量級的"寫的少,做的多"的JavaScript庫。
jQuery 極大地簡化javaScript編程
--juery相比js優點:
① jquery的onload加載事件速度更快,並且多個加載並行 a) 【jq綁定事件都是使用的事件函數,不需要加on】;
② js的onload加載事件,后面的覆蓋前面的;
③ 在jQuery中,$( )是其運行環境;
④ jQuery的模塊可以分為3部分:入口模塊、底層支持模塊和功能模塊。
-- jQuery庫包含以下功能:
HTML 元素選取
HTML 元素操作
CSS 操作
HTML 事件函數
JavaScript 特效和動畫
HTML DOM 遍歷和修改
AJAX
Utilities
1、jQuery的版本下載網址:http://www.jq22.com/jquery-info122
找到要下載的版本,點擊下載
2、 下載hBuilder並運行hBuilder , 在hBuilder中創建一個web項目
在主頁面輪播圖中點擊HBuilder界面進入下載。
這里根據自己的電腦來選擇,我們盡量下載下面的版本,功能強大點,可以支持app開
發。
3、下載好之后進行安裝,並且新建項目名稱為Jquery練習
將第一步中下載好的jQuery資源包進行解壓,將解壓好的.js文件移動到自己的web項目js包里面。
4、引入資源文件,並測試是否引加載成功,如果是undefinition 就沒有引入。
創建一個html頁面,將jQuery的min.js 的資源文件。
<!-- 引用jQuery 資源文件 -->
<script type="text/javascript" src="../js/jquery-3.3.1.min.js" ></script>
<title>JQuery 練習</title>
<!-- 測試JQuery 是否加載 如果是undefinition 就是沒引入。-->
<script>
if(typeof jQuery== "undefined"){
window.alert("jQuery引用失敗!");
}else{
window.alert("jQuery引用成功!");
}
</script>
5、 創建一個簡單的項目,顯示/隱藏 文本框
<!-- 引用jQuery 資源文件 -->
<script type="text/javascript" src="../js/jquery-3.3.1.min.js" ></script>
<title>JQuery 練習</title>
<p id="demo">這是一個文本框</p>
<button onclick="hide()">點擊隱藏文本</button><br />
<button onclick="show()">點擊顯示文本</button>
<script>
//隱藏文本
function hide(){
$("#demo").hide();
}
//顯示文本
function show(){
$("#demo").show();
}
</script>