主頁 > 企業開發 > 【筆記】【JavaScript】【jQuery】菜鳥編程學習筆記

【筆記】【JavaScript】【jQuery】菜鳥編程學習筆記

2022-05-12 08:07:27 企業開發

前言

【內容】

  • jQuery菜鳥編程學習筆記
  • 具體詳情看目錄

【目的】

  • 記錄本人在jQuery學習中的筆記
  • 方便日后的作業與學習,

【學習資料】

jQuery教程-菜鳥教程


【溫馨提示】

  • 筆記中有些個人理解后整理的筆記,可能有所偏差,也懇請讀者幫忙指出,謝謝,


jQuery快速了解

啥是jQuery?

  • 是一個 JavaScript 函式庫
  • 是一個輕量級的"寫的少,做的多"的 JavaScript 庫

能干什么?

  • HTML 元素選取
  • HTML 元素操作
  • CSS 操作
  • HTML 事件函式
  • JavaScript 特效和影片
  • HTML DOM 遍歷和修改
  • AJAX
  • Utilities
  • 提供了大量的插件

如何在網頁檔案中引入jQuery?

方法一:本地參考

  • 從jQuery官網下載jQuery庫

    • 下載版本(二選一)
      • Production version - 用于實際的網站中,已被精簡和壓縮,
      • Development version - 用于測驗和開發(未壓縮,是可讀的代碼),
  • 將下載的檔案放在網頁的同一目錄下

  • 在html檔案中用<script>標簽參考

    <head>
    	<script src="https://www.cnblogs.com/lao-jiaweijarvee/archive/2022/05/11/jquery-對應版本.js"></script>
    </head>
    

方法二:通過CDN(內容分發網路) 參考

  • 直接選一個復制到html中用<script>標簽參考
/*Staticfile CDN*/
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>

/*百度 CDN:*/
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>

/*又拍云 CDN*/
<script src="https://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.2.min.js">
</script>

/*新浪 CDN*/
<script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js"></script>

/*Microsoft CDN*/
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>

PS】推薦使用方法二引入jQuery

  • 減少加載時間,
    • 【解釋】 許多用戶在訪問其他站點時,已經從百度、又拍云、新浪、谷歌或微軟加載過 jQuery,所以結果是,當他們訪問您的站點時,會從快取中加載 jQuery
  • 提高加載速度,
    • 【解釋】 大多數 CDN 都可以確保當用戶向其請求檔案時,會從離用戶最近的服務器上回傳回應

如何查看jQuery使用版本?

  • F12打開 Console(控制臺) 視窗
  • 輸入$.fn.jquery 命令查看當前 jQuery 使用的版本

如何使用jQuery?

jQuery語法

基礎語法

  • 通過選取 HTML 元素,并對選取的元素執行某些操作

【格式】

$(selector).action()

$:定義jQuery

selector(選擇符):"查詢"和"查找" HTML 元素(具體詳情)

action():執行對元素的操作


檔案就緒事件

  • 所有 jQuery 函式位于一個 document ready 函式中
    • 【原因】 為了防止檔案在完全加載(就緒)之前運行 jQuery 代碼,即在 DOM 加載完成后才可以對 DOM 進行操作,

【格式】

格式一:

$(document).ready(function(){
   // 開始寫 jQuery 代碼...
});

格式二:簡潔寫法(與以上寫法效果相同)

$(function(){
   // 開始寫 jQuery 代碼...
});

【拓展】JavaScript檔案就緒事件

格式:

window.onload = function () {
    // 執行代碼
}


jQuery選擇器

  • 允許對 HTML 元素組或單個元素進行操作,
  • 更css中的選擇器相同,
  • 所有選擇器都以美元符號開頭:$()
常用選擇器 格式
元素選擇器 $("元素名")
id 選擇器 $("#id名")
class 選擇器 $(".類名")

了解更多(無須深究可暫時跳過,用到時再具體了解)


如何在獨立檔案中使用jQuery函式?

  • 將jQuery 函式放到獨立的 .js 檔案中,

  • 將函式直接添加到 <head> 部分中

    示例:

    <head>
    <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
    </script>
    <script src="https://www.cnblogs.com/lao-jiaweijarvee/archive/2022/05/11/my_jquery_functions.js"></script>
    </head>
    

【好處】

  • jQuery 函式易于維護

jQuery事件

啥是事件?

  • 頁面對不同訪問者的回應

  • 常見 DOM 事件:

    滑鼠事件 鍵盤事件 表單事件 檔案/視窗事件
    click keypress submit load
    dblclick keydown change resize
    mouseenter keyup focus scroll
    mouseleave blur unload
    hover

了解更多(無須深究可暫時跳過,用到時再具體了解)


如何設定jQuery事件?

【格式】

$("selecter").action(function(){
    //動作觸發后執行的代碼!!!
});

selecter:選擇器

action:事件

function:函式


jQuery 效果

隱藏/顯示

hide()【隱藏】和 show()【顯示】

【格式】

$("selecter").hide(speed,callback);
$("selecter").hide(speed,callback);

speed(隱藏/顯示的速度):可選

  • 值:slowfast毫秒

callback(隱藏/顯示后執行的函式):可選


toggle()【將顯示的隱藏,將隱藏的顯示】

【格式】

$("selecter").toggle(speed,callback);

淡入/淡出

注意

  • 大小寫不能變

fadeln()【淡入已已隱藏的元素】和 fadeOut() 【淡出可見元素】

【格式】

$("selector").fadeIn(speed,callback);
$("selector").fadeOut(speed,callback);

speed(隱藏/顯示的速度):可選

  • 值:slowfast毫秒

callback(淡入后執行的函式):可選


fadeToggle() 【元素已淡出,添加淡入效果;元素已淡入,添加淡出效果】

【格式】

$("selector").fadeToggle(speed,callback);

fadeTo() 【漸變淡入淡出】

【格式】

$("selector").fadeTo(speed,opacity,callback);

opacity(不透明度):將淡入淡出效果設定為給定的不透明度(值介于 0 與 1 之間)

注意

  • 沒有默認引數,必須加上 slow/fast/Time

滑動

slideDown() 【向下滑動元素】 和 slideUp()【向上滑動元素】

【格式】

$("selector").slideDown(speed,callback);
$("selector").slideUp(speed,callback);

speed(效果的時長):可選

  • 值:slowfast毫秒

callback(滑動后執行的函式):可選


slideToggle()【已向下滑動的元素,向上滑動;已向上滑動的元素,向下滑動】

【格式】

$("selector").slideToggle(speed,callback);

影片

animate()【創建自定義影片】

【格式】

 $("selector").animate({params},speed,callback);

params(形成影片的 CSS 屬性):必需

  • 可操作多個屬性
    • 可以同時使用多個屬性
    • 可以操作所有 CSS 屬性
      • 必須使用駝峰標記法書寫所有的屬性名
        • 例如必須使用 paddingLeft 而不是 padding-left,使用 marginRight 而不是 margin-right,等等,
      • 色彩影片并不包含在核心 jQuery 庫中
        • 如果需要生成顏色影片,您需要從 jquery.com 下載
          顏色影片 插件,
  • 可使用相對值
    • 相對值(該值相對于元素的當前值),需要在值的前面加上+=-=
  • 可使用預定義的值
    • 可以把屬性的影片值設定為 showhidetoggle
  • 可使用對列功能
    • 撰寫多個 animate() 呼叫,逐一運行這些 animate 呼叫,

speed(效果的時長):可選

  • 值:slowfast毫秒

callback(影片完成后執行的函式):可選

注意

  • 如需對位置進行操作,要記得首先把元素的 CSS position 屬性設定為 relative、fixed 或 absolute
    • 【原因】默認情況下,所有 HTML 元素都有一個靜態位置,且無法移動,

停止影片

stop() 【在它們完成之前,停止影片或效果】

  • 適用于所有 jQuery 效果函式,包括滑動、淡入淡出和自定義影片

【格式】

 $("selector").stop(stopAll,goToEnd);

stopAll(是否應該清除影片佇列):

  • false:默認
    • 僅停止活動的影片,允許任何排入佇列的影片向后執行,
  • true:所有影片都不執行

goToEnd(是否立即完成當前影片):

  • false:默認
    • 會清除在被選元素上指定的當前影片
  • true
    • 執行完當前影片再停止后續影片

Callback方法(回呼)

  • 在當前影片 100% 完成之后執行
  • 有Callback和無Calback的區別
    • 有Callback:執行完影片在執行回呼函式
    • 無Callback:直接執行后續函式

鏈(Chaining)

  • 可以把動作/方法鏈接在一起
  • 允許我們在一條陳述句中運行多個 jQuery 方法(在相同的元素上)
  • 依次執行

【格式】

$("selecter").action1().action2().action3()....actionN();

【縮進格式】

$("selecter").action1()
    .action2()
    .action3()
    ...
    .actionN();

注意

  • 無須擔心縮進格式中的空格
    • 【原因】jQuery 會拋掉多余的空格,并當成一行長代碼來執行上面的代碼行,

更多方法【了解即可】

jQuery 效果方法


jQuery HTML

  • jQuery 擁有可操作 HTML 元素和屬性的強大方法,
  • jQuery 中非常重要的部分,就是操作 DOM 的能力,
  • jQuery 提供一系列與 DOM 相關的方法,這使訪問和操作元素和屬性變得很容易,

【拓展】什么是DOM?

  • DOM = Document Object Model(檔案物件模型)
  • DOM 定義訪問 HTML 和 XML 檔案的標準

獲取內容和屬性

獲取內容方法

方法名 設定或回傳內容
text() 所選元素的文本內容
html() 所選元素的內容(包括 HTML 標記)
val() 表單欄位的值

獲取屬性

attr() 【獲取自定義屬性值】

【格式】

$("selecter").attr("想要獲取值的屬性")

prop()【獲取固有屬性值】

【格式】

$("selecter").prop("想要獲取值的屬性")

【PS】

  • 具有 true 和 false 兩個屬性的屬性,如 checked, selected 或者 disabled 使用prop()

【拓展】啥是固有屬性?

  • 元素本身就帶有的屬性
  • W3C 標準里就包含有的屬性
  • IDE 里能夠智能提示出的屬性

attr()和prop()的區別

attr() prop()
用途 獲取自定義屬性值 獲取固有屬性值
如果沒有相應的屬性,回傳值 undefined 空字串

設定內容和屬性

設定內容方法

方法名 設定或回傳內容
text("文本內容") 所選元素的文本內容
html("帶標簽的內容") 所選元素的內容(包括 HTML 標記)
val("值") 表單欄位的值

text()、html() 以及 val() 的回呼函式

【格式】

$("selecter").text(function(index,origText){
    //方法代碼
});
$("selecter").html(function(index,origText){
    //方法代碼
});
$("selecter").val(function(index,origText){
    //方法代碼
});

index:被選元素串列中當前元素的下標

origText:原始(舊的)值,


設定屬性

attr()方法設定屬性值

【格式】

//設定單個屬性
$("selecter").attr("屬性","想要設定的值");

//設定多個屬性
$("selecter").attr({
    "屬性1":"屬性1的值",
    "屬性2":"屬性2的值",
    ....
    "屬性N":"屬性N的值",
});

attr() 的回呼函式

【格式】

$("selecter").attr("屬性",function(index,orgValue){
    //方法代碼
});

index:被選元素串列中當前元素的下標

orgValue:原始(舊的)值


添加元素/內容

append()【在被選元素的結尾插入內容(仍然在該元素的內部)】

【格式】

$("selecter").append("追加文本");

prepend() 【在被選元素的開頭插入內容(仍然在該元素的內部)】

【格式】

$("selecter").prepend("在開頭追加文本");

通過 append() 和 prepend() 方法添加若干新元素、

【思路】

  • 創建若干個新元素
    • 這些元素可以通過 text/HTML、jQuery 或者 JavaScript/DOM 來創建
  • 然后通過 append() 方法把這些新元素追加到文本中(對 prepend() 同樣有效)

【格式】

var txt1="<p>文本-1,</p>";              // 使用 HTML 標簽創建文本
var txt2=$("<p></p>").text("文本-2,");  // 使用 jQuery 創建文本
var txt3=document.createElement("p");
    txt3.innerHTML="文本-3,";               // 使用 DOM 創建文本 text with DOM
$("body").append(txt1,txt2,txt3);        // 追加新元素

after() 【在被選元素之插入內容】 和 before()【在被選元素之插入內容】

【格式】

$("selecter"").after("在元素后面添加文本");

$("selecter").before("在元素前面添加文本");

通過 after() 和 before() 方法添加若干新元素

【思路】

  • 創建若干新元素
    • 這些元素可以通過 text/HTML、jQuery 或者 JavaScript/DOM 來創建
  • 然后通過 after() 方法把這些新元素插到文本中(對 before() 同樣有效)

【格式】

var txt1="<b>I </b>";                    // 使用 HTML 創建元素
var txt2=$("<i></i>").text("love ");     // 使用 jQuery 創建元素
var txt3=document.createElement("big");  // 使用 DOM 創建元素
    txt3.innerHTML="jQuery!";
$("selecter").after(txt1,txt2,txt3);          // 在圖片后添加文本

【append/prepend】和【after/before】有什么區別?

  • 【append/prepend】 是在選擇元素內部嵌入,
  • 【after/before】 是在元素外面追加,

洗掉元素/內容

remove()方法

洗掉被選元素子元素

【格式】

$("selecter").remove();

過濾被洗掉的元素

【格式】

$("selecter").remove("selecter");

empty()方法

洗掉被選元素的子元素

【格式】

$("selecter").empty();

獲取并設定CSS類

方法名 功能
addClass() 向不同的元素添加 class 屬性
removeClass() 在不同的元素中洗掉指定的 class 屬性
toggleClass() 對被選元素進行添加/洗掉類的切換操作

【格式】

$("元素1,元素2,元素3,...,元素N").addClass("類名1 類名2 類名N");

$("元素1,元素2,元素3,...,元素N").removeClass("類名1 類名2 類名N");

$("元素1,元素2,元素3,...,元素N").toggleClass("類名1 類名2 類名N");

注意

  • 指定多個元素用,隔開
  • 添加多個類用空格隔開

CSS()方法

回傳指定的 CSS 屬性的值

【格式】

$("selecter").css("propertyname");

propertyname:想要獲取值的CSS屬性


設定指定的 CSS 屬性

【格式】

$("selecter").css("propertyname","value");

propertyname:想要設定值的CSS屬性

value:該屬性的值


設定多個 CSS 屬性

【格式】

$("selecter").css({
    "屬性1":"值1",
    "屬性2":"值2",
    ...
    "屬性N":"值N",
});

尺寸

【設定或回傳元素的寬度

方法名 描述
width() 不包括內邊距、邊框或外邊距
innerWidth() 包括內邊距
outerWidth() 包括內邊距和邊框

【格式】

$("selecter").width();

$("selecter").innerWidth();

$("selecter").outerWidth();

【設定或回傳元素的高度

方法名 描述
height() 不包括內邊距、邊框或外邊距
innerWidth() 包括內邊距
outerWidth() 包括內邊距和邊框

【格式】

$("selecter").height();

$("selecter").innerHeight();

$("selecter").outerHeight();

了解更多

jQuery HTML / CSS 方法


jQuery 遍歷

什么是遍歷?

  • 就是移動
    • 【解釋】用于根據其相對于其他元素的關系來"查找"(或選取)HTML 元素,以某項選擇開始,并沿著這個選擇移動,直到抵達您期望的元素為止,

對DOM 進行遍歷

  • 從被選(當前的)元素開始,輕松地在家族樹中向上移動(祖先),向下移動(子孫),水平移動(同胞)


祖先【向上遍歷 DOM 樹】

方法名 功能描述 方法回傳
parent() 只會向上一級對 DOM 樹進行遍歷 被選元素的直接父元素
parents() 一路向上直到檔案的根元素 (<html>) 被選元素的所有祖先元素
parentsUntil() 介于兩個給定元素之間的所有祖先元素

【格式】

/* parent方法 */
//回傳"selecter"的直接父元素
$("selecter").parent();

/* parents方法 */
//回傳"selecter"的所有祖先元素
$("selecter").parents();
//回傳"selecter"的所有祖先元素中的被選中元素
$("selecter").parents("selecterChosen");

/* parentsUntill方法 */
//回傳"selecterStart"到"selecterEnd"中所有祖先元素
$("selecterStart").parentsUntill("selecterEnd");

后代【向下遍歷 DOM 樹】

方法名 功能描述 方法回傳
children() 只會向下一級對 DOM 樹進行遍歷 被選元素的所有直接子元素
find() 一路向下直到最后一個后代 被選元素的后代元素

【格式】

/* children方法 */
//回傳被選元素的所有直接子元素
 $("selecter").children();
//使用可選引數來過濾對子元素的搜索
 $("selecter").children("selecterChosen");

/* find方法 */
//回傳屬于"selecter"后代的所有"selecterChosen"元素
$("selecter").find("selecterChosen");
//回傳"selecter"的所有后代
$("selecter").find("*");

同胞【在 DOM 樹中水平遍歷】

方法名 方法回傳 方向相反方法
siblings() 被選元素的所有同胞元素
next() 只回傳一個元素,被選元素的下一個同胞元素 prev()
nextAll() 被選元素的所有跟隨的同胞元素 prevAll()
nextUntil() 介于兩個給定引數之間的所有跟隨的同胞元素 prevUntil()

【格式】

/* siblings() 方法 */
//回傳 "selecter" 的所有同胞元素
$("selecter").siblings();
//回傳屬于 "selecter" 的同胞元素中的所有 "selecterChosen" 元素
$("selecter").siblings("selecterChosen");

/* next() 方法 */
//回傳 "selecter" 的下一個同胞元素
$("selecter").next();

/* nextAll() 方法 */
//回傳 "selecter" 的所有跟隨的同胞元素
$("selecter").nextAll();

/* nextUntil() 方法 */
//回傳介于 "selecterStart" 與 "selecterEnd" 元素之間的所有同胞元素
$("selecterStart").nextUntil("selecterEnd");

過濾【縮小搜索元素的范圍】

基本過濾方法

  • 允許您基于其在一組元素中的位置來選擇一個特定的元素,
方法名 方法回傳
first() 被選元素的首個元素
last() 被選元素的最后一個元素
eq() 被選元素中帶有指定索引號的元素

【格式】

/* first() 方法 */
//選取首個 "selecterFather" 元素內部的第一個 "selecterSon" 元素
$("selecterFather selecterSon").first();

/* last() 方法 */
//選擇最后一個 "selecterFather" 元素中的最后一個 "selecterSon" 元素
$("selecterFather selecterSon").last();

/* eq() 方法 */
//選取第 index+1 個 "selecter" 元素    (索引號從 0 開始)
$("selecter").eq(index);

其他過濾方法

  • 允許您選取匹配或不匹配某項指定標準的元素,

filter() 方法

  • 允許您規定一個標準,
    • 匹配這個標準的元素:會被從集合中洗掉
    • 匹配的元素:會被回傳

【格式】

//回傳帶有 "selecterChosen" 的所有 "selecter" 元素
$("selecter").filter("selecterChosen");

not() 方法

  • not() 方法與 filter() 相反

  • 允許您規定一個標準,

    • 匹配這個標準的元素:會被回傳
    • 匹配的元素:會被從集合中洗掉

【格式】

//回傳不帶有 "selecterChosen" 的所有 "selecter" 元素
$("selecter").not("selecterChosen");

了解更多

jQuery 遍歷方法


jQuery AJAX

啥是AJAX?

  • 與服務器交換資料的技術,它在不多載全部頁面的情況下,實作了對部分網頁的更新,
  • AJAX = 異步 JavaScript 和 XML

jQuery與AJAX有啥關系?

  • jQuery 提供多個與 AJAX 有關的方法,
  • 通過 jQuery AJAX 方法,您能夠使用 HTTP Get 和 HTTP Post 從遠程服務器上請求文本、HTML、XML 或 JSON - 同時您能夠把這些外部資料直接載入網頁的被選元素中,

AJAX load()方法

  • 從服務器加載資料,并把回傳的資料放入被選元素中,

【格式】

$(selector).load(URL,data,callback);

URL(希望加載的 URL):必需

data(與請求一同發送的查詢字串鍵/值對集合):可選

callback( load() 方法完成后所執行的函式名稱):可選

  • 可以設定不同的引數:
    • responseTxt :包含呼叫成功時的結果內容
    • statusTXT :包含呼叫的狀態
    • xhr :包含 XMLHttpRequest 物件

AJAX get()/post()方法

  • 通過 HTTP GET 或 POST 請求從服務器請求資料,

HTTP 請求:GET 與 POST 的區別

GET POST
對指定的資源操作 請求資料 提交要處理的資料
資料能否快取 可快取 無法快取
發送的資料數量 只能發送有限數量的資料 可以發送大量的資料
資料發送位置 在 URL 中發送 在正文主體中發送
安全性 發送的資料不受保護 發送的資料是安全的
資料在 URL 欄中是否公開 公開 不公開
可變大小 2000 個字符 最多允許 8 Mb
主要作用 獲取資訊 更新資料
表單提交時編碼 只接受 ASCII 字符 不系結表單資料型別,并允許二進制和 ASCII 字符

jQuery $.get() 方法

  • 通過 HTTP GET 請求從服務器上請求資料,

【格式】

$.get(URL,callback);

URL(希望請求的 URL):必需

callback(請求成功后所執行的函式名):可選


jQuery $.post() 方法

  • 通過 HTTP POST 請求向服務器提交資料,

【格式】

$.post(URL,data,callback); 

URL(希望請求的 URL):必需

data(連同請求發送的資料):可選

callback(請求成功后所執行的函式名):可選


了解更多

jQuery AJAX 方法


結語

【感謝】

感謝菜鳥編程提供學習的平臺!!!

感謝各位讀者能看到最后!!!

轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/472384.html

標籤:其他

上一篇:vue - Vue路由

下一篇:從列的最后一行自動填充到整個作業表的最后一行

標籤雲
其他(157675) Python(38076) JavaScript(25376) Java(17977) C(15215) 區塊鏈(8255) C#(7972) AI(7469) 爪哇(7425) MySQL(7132) html(6777) 基礎類(6313) sql(6102) 熊猫(6058) PHP(5869) 数组(5741) R(5409) Linux(5327) 反应(5209) 腳本語言(PerlPython)(5129) 非技術區(4971) Android(4554) 数据框(4311) css(4259) 节点.js(4032) C語言(3288) json(3245) 列表(3129) 扑(3119) C++語言(3117) 安卓(2998) 打字稿(2995) VBA(2789) Java相關(2746) 疑難問題(2699) 细绳(2522) 單片機工控(2479) iOS(2429) ASP.NET(2402) MongoDB(2323) 麻木的(2285) 正则表达式(2254) 字典(2211) 循环(2198) 迅速(2185) 擅长(2169) 镖(2155) 功能(1967) .NET技术(1958) Web開發(1951) python-3.x(1918) HtmlCss(1915) 弹簧靴(1913) C++(1909) xml(1889) PostgreSQL(1872) .NETCore(1853) 谷歌表格(1846) Unity3D(1843) for循环(1842)

熱門瀏覽
  • IEEE1588PTP在數字化變電站時鐘同步方面的應用

    IEEE1588ptp在數字化變電站時鐘同步方面的應用 京準電子科技官微——ahjzsz 一、電力系統時間同步基本概況 隨著對IEC 61850標準研究的不斷深入,國內外學者提出基于IEC61850通信標準體系建設數字化變電站的發展思路。數字化變電站與常規變電站的顯著區別在于程序層傳統的電流/電壓互 ......

    uj5u.com 2020-09-10 03:51:52 more
  • HTTP request smuggling CL.TE

    CL.TE 簡介 前端通過Content-Length處理請求,通過反向代理或者負載均衡將請求轉發到后端,后端Transfer-Encoding優先級較高,以TE處理請求造成安全問題。 檢測 發送如下資料包 POST / HTTP/1.1 Host: ac391f7e1e9af821806e890 ......

    uj5u.com 2020-09-10 03:52:11 more
  • 網路滲透資料大全單——漏洞庫篇

    網路滲透資料大全單——漏洞庫篇漏洞庫 NVD ——美國國家漏洞庫 →http://nvd.nist.gov/。 CERT ——美國國家應急回應中心 →https://www.us-cert.gov/ OSVDB ——開源漏洞庫 →http://osvdb.org Bugtraq ——賽門鐵克 →ht ......

    uj5u.com 2020-09-10 03:52:15 more
  • 京準講述NTP時鐘服務器應用及原理

    京準講述NTP時鐘服務器應用及原理京準講述NTP時鐘服務器應用及原理 安徽京準電子科技官微——ahjzsz 北斗授時原理 授時是指接識訓通過某種方式獲得本地時間與北斗標準時間的鐘差,然后調整本地時鐘使時差控制在一定的精度范圍內。 衛星導航系統通常由三部分組成:導航授時衛星、地面檢測校正維護系統和用戶 ......

    uj5u.com 2020-09-10 03:52:25 more
  • 利用北斗衛星系統設計NTP網路時間服務器

    利用北斗衛星系統設計NTP網路時間服務器 利用北斗衛星系統設計NTP網路時間服務器 安徽京準電子科技官微——ahjzsz 概述 NTP網路時間服務器是一款支持NTP和SNTP網路時間同步協議,高精度、大容量、高品質的高科技時鐘產品。 NTP網路時間服務器設備采用冗余架構設計,高精度時鐘直接來源于北斗 ......

    uj5u.com 2020-09-10 03:52:35 more
  • 詳細解讀電力系統各種對時方式

    詳細解讀電力系統各種對時方式 詳細解讀電力系統各種對時方式 安徽京準電子科技官微——ahjzsz,更多資料請添加VX 衛星同步時鐘是我京準公司開發研制的應用衛星授時時技術的標準時間顯示和發送的裝置,該裝置以M國全球定位系統(GLOBAL POSITIONING SYSTEM,縮寫為GPS)或者我國北 ......

    uj5u.com 2020-09-10 03:52:45 more
  • 如何保證外包團隊接入企業內網安全

    不管企業規模的大小,只要企業想省錢,那么企業的某些服務就一定會采用外包的形式,然而看似美好又經濟的策略,其實也有不好的一面。下面我通過安全的角度來聊聊使用外包團的安全隱患問題。 先看看什么服務會使用外包的,最常見的就是話務/客服這種需要大量重復性、無技術性的服務,或者是一些銷售外包、特殊的職能外包等 ......

    uj5u.com 2020-09-10 03:52:57 more
  • PHP漏洞之【整型數字型SQL注入】

    0x01 什么是SQL注入 SQL是一種注入攻擊,通過前端帶入后端資料庫進行惡意的SQL陳述句查詢。 0x02 SQL整型注入原理 SQL注入一般發生在動態網站URL地址里,當然也會發生在其它地發,如登錄框等等也會存在注入,只要是和資料庫打交道的地方都有可能存在。 如這里http://192.168. ......

    uj5u.com 2020-09-10 03:55:40 more
  • [GXYCTF2019]禁止套娃

    git泄露獲取原始碼 使用GET傳參,引數為exp 經過三層過濾執行 第一層過濾偽協議,第二層過濾帶引數的函式,第三層過濾一些函式 preg_replace('/[a-z,_]+\((?R)?\)/', NULL, $_GET['exp'] (?R)參考當前正則運算式,相當于匹配函式里的引數 因此傳遞 ......

    uj5u.com 2020-09-10 03:56:07 more
  • 等保2.0實施流程

    流程 結論 ......

    uj5u.com 2020-09-10 03:56:16 more
最新发布
  • 使用Django Rest framework搭建Blog

    在前面的Blog例子中我們使用的是GraphQL, 雖然GraphQL的使用處于上升趨勢,但是Rest API還是使用的更廣泛一些. 所以還是決定回到傳統的rest api framework上來, Django rest framework的官網上給了一個很好用的QuickStart, 我參考Qu ......

    uj5u.com 2023-04-20 08:17:54 more
  • 記錄-new Date() 我忍你很久了!

    這里給大家分享我在網上總結出來的一些知識,希望對大家有所幫助 大家平時在開發的時候有沒被new Date()折磨過?就是它的諸多怪異的設定讓你每每用的時候,都可能不小心踩坑。造成程式意外出錯,卻一下子找不到問題出處,那叫一個煩透了…… 下面,我就列舉它的“四宗罪”及應用思考 可惡的四宗罪 1. Sa ......

    uj5u.com 2023-04-20 08:17:47 more
  • 使用Vue.js實作文字跑馬燈效果

    實作文字跑馬燈效果,首先用到 substring()截取 和 setInterval計時器 clearInterval()清除計時器 效果如下: 實作代碼如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta ......

    uj5u.com 2023-04-20 08:12:31 more
  • JavaScript 運算子

    JavaScript 運算子/運算子 在 JavaScript 中,有一些運算子可以使代碼更簡潔、易讀和高效。以下是一些常見的運算子: 1、可選鏈運算子(optional chaining operator) ?.是可選鏈運算子(optional chaining operator)。?. 可選鏈操 ......

    uj5u.com 2023-04-20 08:02:25 more
  • CSS—相對單位rem

    一、概述 rem是一個相對長度單位,它的單位長度取決于根標簽html的字體尺寸。rem即root em的意思,中文翻譯為根em。瀏覽器的文本尺寸一般默認為16px,即默認情況下: 1rem = 16px rem布局原理:根據CSS媒體查詢功能,更改根標簽的字體尺寸,實作rem單位隨螢屏尺寸的變化,如 ......

    uj5u.com 2023-04-20 08:02:21 more
  • 我的第一個NPM包:panghu-planebattle-esm(胖虎飛機大戰)使用說明

    好家伙,我的包終于開發完啦 歡迎使用胖虎的飛機大戰包!! 為你的主頁添加色彩 這是一個有趣的網頁小游戲包,使用canvas和js開發 使用ES6模塊化開發 效果圖如下: (覺得圖片太sb的可以自己改) 代碼已開源!! Git: https://gitee.com/tang-and-han-dynas ......

    uj5u.com 2023-04-20 08:01:50 more
  • 如何在 vue3 中使用 jsx/tsx?

    我們都知道,通常情況下我們使用 vue 大多都是用的 SFC(Signle File Component)單檔案組件模式,即一個組件就是一個檔案,但其實 Vue 也是支持使用 JSX 來撰寫組件的。這里不討論 SFC 和 JSX 的好壞,這個仁者見仁智者見智。本篇文章旨在帶領大家快速了解和使用 Vu ......

    uj5u.com 2023-04-20 08:01:37 more
  • 【Vue2.x原始碼系列06】計算屬性computed原理

    本章目標:計算屬性是如何實作的?計算屬性快取原理以及洋蔥模型的應用?在初始化Vue實體時,我們會給每個計算屬性都創建一個對應watcher,我們稱之為計算屬性watcher ......

    uj5u.com 2023-04-20 08:01:31 more
  • http1.1與http2.0

    一、http是什么 通俗來講,http就是計算機通過網路進行通信的規則,是一個基于請求與回應,無狀態的,應用層協議。常用于TCP/IP協議傳輸資料。目前任何終端之間任何一種通信方式都必須按Http協議進行,否則無法連接。tcp(三次握手,四次揮手)。 請求與回應:客戶端請求、服務端回應資料。 無狀態 ......

    uj5u.com 2023-04-20 08:01:10 more
  • http1.1與http2.0

    一、http是什么 通俗來講,http就是計算機通過網路進行通信的規則,是一個基于請求與回應,無狀態的,應用層協議。常用于TCP/IP協議傳輸資料。目前任何終端之間任何一種通信方式都必須按Http協議進行,否則無法連接。tcp(三次握手,四次揮手)。 請求與回應:客戶端請求、服務端回應資料。 無狀態 ......

    uj5u.com 2023-04-20 08:00:32 more