JavaScript強化教程——JQuery初級教程

時間 2021-01-03

標籤 html jquery ide 函數 spa orm htm 教程事件欄目 JavaScript 简体版

原文原文鏈接

本文爲 H5EDU 機構官方 HTML5培訓教程，主要介紹：JavaScript強化教程 ——JQuery初級教程

第一步下載jquery
首先須要在jquery官網下載 jquery-3.0.0.js（版本和當前最新版本一致）放到本身的文件夾中
第二部引用jquery
html

<script src="jquery-3.0.0.js"></script>

第三部使用jquery語法寫一個簡單地程序
jquery

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.0.0.js"></script>
</head>
<body>
<input type="button" value="隱藏" id="a">
<input type="button" value="顯示" id="b">
<div id="c" style="height: 100px;width: 100px;background-color: cadetblue"></div>
<script>

  //事件源        事件      函數

//id選擇器選擇a bind綁定click函數
    $("#a").bind("click",function (event){

//fadeIn  500毫秒淡入   fadeOut 淡出
        $("div").fadeIn(500);
        })
    $("#b").bind("click",function (event){
        $("div").fadeOut(1000);
    })
});
</script>
</body>
</html>

點擊進入JS強化教程
ide