創作內容

0 GP

jquery語法

作者:蝦米coco│2021-01-07 01:32:10│巴幣:0│人氣:162
jquery是一個簡化HTML和javascript的程式庫語法

需要從外面導入資料庫 https://code.jquery.com/jquery-3.5.1.slim.min.js

$("p")標籤
$(".class")類別
$("#ID") ID
$(document).ready(function(){}) DOM結構繪製完畢後就執行,可以同時編寫多個,如果有多個window.onload方法,只會讀取最後一個
$(window).load(function(){})頁面內包括圖片的所有元素載入完畢後才能執行,

$("this").click(function()){$("this").hide()//設按一下按的物件(this)消失}//設定按鈕事件
click()按一下觸發事件
dbclick()按兩下觸發事件
focus()输入框获得焦点时
mouseover()滑鼠滑入觸發事件

$("this").hide(時間) 物件("this")消失 時間(豪秒) 空值(永久)
show()物件("this")顯示
fadeOut(時間)淡出 時間(豪秒) ID為物件
fadeIn(時間)淡入
fadeTO(speed,透明度) 調整透明度 透明度1.0~0.0  speed:可能的值:毫秒 (比如 1500) "slow" "normal" "fast"
slideDown(時間)滑下展開 時間(豪秒)
slideUp(時間)滑上展開(ps:要先隱藏起來)
slideToggle()
animate({left:'250px'//移動方向距離,opacity:"0.5"//透明度,width:"150px",height:'150px'},//時間(豪秒))播放動畫,可以使用+=來增加移動距離
alert("內文:"+$("p").text());所有有用<p>的印在警告窗
alert("內文:"+$("p").html());第一個有<p>的印在警告窗
alert("內文:"+$("p").val());抓取輸入框的內容
alert("內文:"+$("#a1").attr("href"));抓取超連結的href

沒有外距
$("p").append("<b>這是a1的</b>");把 <b>這是a1的</b>加在p內容最後一個,如果()中用$( "h2" )就會在</p>下方產生<h2></h2>
$("ul").prepend("<li>這是b1的</li>");在p內容最前一個
有外距的
$("ul").after("<b>這是a2的</b>");在ul內容最後一個
$("ul").before("<li>這是b2的</li>");在ul內容最前一個

text3.innerHTML="測試3" 把文字輸入進text3 text3是文字變數
document.createElement("p");建立新的p元素
$("p").remove("物件");空為刪除p全部 物件為刪除p中有這個類別的物件
remove();刪除子元素
addClass();增加元素
removeClass();刪除類別元素
toggleClass();切換類別
css("1","2");取代  "1"stlye的屬性 "2"放要取代的'stlye的屬性的值

$("div").width()取得寬
height()取得高
innerWidth()取得寬包含內距
innerHeight()取得高包含內距
outerWidth()取得寬包含內距外距
outerHeight()取得高包含內距外距

$("div")"div"可以換成window、document

異步執行
$("#load_test").load("demo_jq.txt",回傳檔案//可空,回傳狀態//可空);在哪個ID載入外部下載"demo_jq.txt"資料並取代取代文字內容 "demo_jq.txt #p1"這樣只會載入有id=p1的資料 #p1,#p2這樣可以多個id(要在""中不是在""外)

回傳狀態函數function(responseTxt,statusTxt,xhr) responseTxt成功結果內容 statusTxt調用狀態 xhr請求對象
statusTxt如果成功是傳回success 失敗是error
xhr.status
xhr.statusText

$.get(URL,callback); URL讀取檔案路徑 callback回傳狀態
callback可用回傳狀態函數function(date,status) date資料回傳  status狀態
$.post(URL,date,callback,type); URL讀取檔案路徑 date發送資料 callback回傳狀態 type返回内容格式(xml, html, script, json, text, _default)
callback可用回傳狀態函數function(date,status) date資料回傳  status狀態
date發送資料可用{json格式}

$("ID").blur(function(){})

$getJSON(URL,function(){})URL讀取檔案路徑
$("ID").text(result["name"]); result抓取json的[key] 值
$each();逐筆列出

$.ajax()
$.getJSON()


引用網址:https://home.gamer.com.tw/TrackBack.php?sn=5036132
All rights reserved. 版權所有,保留一切權利

相關創作

留言共 0 篇留言

我要留言提醒:您尚未登入,請先登入再留言

喜歡★pk123634 可決定是否刪除您的留言,請勿發表違反站規文字。

前一篇:2020整理... 後一篇:我買的amazarash...

追蹤私訊切換新版閱覽

作品資料夾

ShuLongQinHu大家
小屋新增新的彩色插圖~(雖然長得像濕婆但不是濕婆看更多我要大聲說13小時前


face基於日前微軟官方表示 Internet Explorer 不再支援新的網路標準,可能無法使用新的應用程式來呈現網站內容,在瀏覽器支援度及網站安全性的雙重考量下,為了讓巴友們有更好的使用體驗,巴哈姆特即將於 2019年9月2日 停止支援 Internet Explorer 瀏覽器的頁面呈現和功能。
屆時建議您使用下述瀏覽器來瀏覽巴哈姆特:
。Google Chrome(推薦)
。Mozilla Firefox
。Microsoft Edge(Windows10以上的作業系統版本才可使用)

face我們了解您不想看到廣告的心情⋯ 若您願意支持巴哈姆特永續經營,請將 gamer.com.tw 加入廣告阻擋工具的白名單中,謝謝 !【教學】