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

来源:https://www.cnblogs.com/lao-jiaweijarvee/archive/2022/05/11/16259954.html
-Advertisement-
Play Games

前言 【內容】 jQuery菜鳥編程學習筆記 具體詳情看目錄 【目的】 記錄本人在jQuery學習中的筆記 方便日後的工作與學習。 【學習資料】 jQuery教程-菜鳥教程 【溫馨提示】 筆記中有些個人理解後整理的筆記，可能有所偏差，也懇請讀者幫忙指出，謝謝。 jQuery快速瞭解 啥是jQuery ...


前言

【內容】

  • 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="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="my_jquery_functions.js"></script>
</head>

【好處】

  • jQuery 函數易於維護

jQuery事件

啥是事件？

瞭解更多（無須深究可暫時跳過，用到時再具體瞭解）


如何設置jQuery事件?

【格式】

$("selecter").action（function(){
    //動作觸發後執行的代碼！！！
}）;

selecter：選擇器

action：事件

function：函數


jQuery 效果

隱藏/顯示

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

【格式】

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

speed（隱藏/顯示的速度）：可選

  • 值：slow、fast、毫秒

callback（隱藏/顯示後執行的函數）：可選


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

【格式】

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

淡入/淡出

【註意】

  • 大小寫不能變

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

【格式】

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

speed（隱藏/顯示的速度）：可選

  • 值：slow、fast、毫秒

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（效果的時長）：可選

  • 值：slow、fast、毫秒

callback（滑動後執行的函數）：可選


slideToggle()【已向下滑動的元素，向上滑動；已向上滑動的元素，向下滑動】

【格式】

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

動畫

animate()【創建自定義動畫】

【格式】

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

params（形成動畫的 CSS 屬性）：必需

  • 可操作多個屬性
    • 可以同時使用多個屬性
    • 可以操作所有 CSS 屬性
      • 必須使用駝峰標記法書寫所有的屬性名
        • 例如必須使用 paddingLeft 而不是 padding-left，使用 marginRight 而不是 margin-right，等等。
      • 色彩動畫並不包含在核心 jQuery 庫中
  • 可使用相對值
    • 相對值（該值相對於元素的當前值）。需要在值的前面加上+=或 -=
  • 可使用預定義的值
    • 可以把屬性的動畫值設置為 show、hide 或 toggle
  • 可使用對列功能
    • 編寫多個 animate() 調用，逐一運行這些 animate 調用。

speed（效果的時長）：可選

  • 值：slow、fast、毫秒

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 方法


結語

【感謝】

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

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


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

-Advertisement-
Play Games
更多相關文章
  • 《第一行代碼：Android篇》學習筆記（十一）
    本文和接下來的幾篇文章為閱讀郭霖先生所著《第一行代碼：Android（篇第2版）》的學習筆記，按照書中的內容順序進行記錄，書中的Demo本人全部都做過了。 每一章節本人都做了詳細的記錄，以下是我學習記錄（包含大量書中內容的整理和自己在學習中遇到的各種bug及解決方案），方便以後閱讀和查閱。最後，非常 ...
  • 《第一行代碼：Android篇》學習筆記（十）
    本文和接下來的幾篇文章為閱讀郭霖先生所著《第一行代碼：Android（篇第2版）》的學習筆記，按照書中的內容順序進行記錄，書中的Demo本人全部都做過了。 每一章節本人都做了詳細的記錄，以下是我學習記錄（包含大量書中內容的整理和自己在學習中遇到的各種bug及解決方案），方便以後閱讀和查閱。最後，非常 ...
  • 《第一行代碼：Android篇》學習筆記（九）
    本文和接下來的幾篇文章為閱讀郭霖先生所著《第一行代碼：Android（篇第2版）》的學習筆記，按照書中的內容順序進行記錄，書中的Demo本人全部都做過了。 每一章節本人都做了詳細的記錄，以下是我學習記錄（包含大量書中內容的整理和自己在學習中遇到的各種bug及解決方案），方便以後閱讀和查閱。最後，感激 ...
  • 《第一行代碼：Android篇》學習筆記（八）
    本文和接下來的幾篇文章為閱讀郭霖先生所著《第一行代碼：Android（篇第2版）》的學習筆記，按照書中的內容順序進行記錄，書中的Demo本人全部都做過了。 每一章節本人都做了詳細的記錄，以下是我學習記錄（包含大量書中內容的整理和自己在學習中遇到的各種bug及解決方案），方便以後閱讀和查閱。最後，感激 ...
  • 《第一行代碼：Android篇》學習筆記（七）
    本文和接下來的幾篇文章為閱讀郭霖先生所著《第一行代碼：Android（篇第2版）》的學習筆記，按照書中的內容順序進行記錄，書中的Demo本人全部都做過了。 每一章節本人都做了詳細的記錄，以下是我學習記錄（包含大量書中內容的整理和自己在學習中遇到的各種bug及解決方案），方便以後閱讀和查閱。最後，感激 ...
  • 《第一行代碼：Android篇》學習筆記（六）
    本文和接下來的幾篇文章為閱讀郭霖先生所著《第一行代碼：Android（篇第2版）》的學習筆記，按照書中的內容順序進行記錄，書中的Demo本人全部都做過了。 每一章節本人都做了詳細的記錄，以下是我學習記錄（包含大量書中內容的整理和自己在學習中遇到的各種bug及解決方案），方便以後閱讀和查閱。最後，感激 ...
  • iOS Widget
    信息爆發時代，有效率有質量地整理視頻、音頻、文字等信息變得尤為重要。會議、講座、採訪、客服電話等場景均需要形成完整的文字記錄材料，音視頻文件也要配有字幕。語音轉文字的智能化，讓信息錄入即時高效。 在直播類、會議類、筆記類的應用中都具備實時語音轉寫功能。例如，在音視頻會議中，可以將發言內容可視化，即時 ...
  • 趙海鵬：如何進行 OpenHarmony 音頻特性架構設計和開發工作
    本期 OpenAtom OpenHarmony（以下簡稱“OpenHarmony”）開發者故事，我們特別採訪了 2 月代碼最佳貢獻者、一位接觸 OpenHarmony 1 年左右，2022 年初便完成高難度開發項目的開發者——潤和軟體資深軟體開發工程師趙海鵬。 ...
一周排行
    -Advertisement-
    Play Games
  • （開源）都進來！簡單易懂、功能強大的許可權+可視化流程管理系統
    1、預覽地址：http://139.155.137.144:9012 2、qq群:801913255 一、前言 隨著網路的發展，企業對於信息系統數據的保密工作愈發重視，不同身份、角色對於數據的訪問許可權都應該大相徑庭。 列如 1、不同登錄人員對一個數據列表的可見度是不一樣的，如數據列、數據行、數據按鈕 ...
  • 設計模式-C#實現簡單工廠模式
    前言 上一篇文章寫瞭如何使用RabbitMQ做個簡單的發送郵件項目，然後評論也是比較多，也是準備去學習一下如何確保RabbitMQ的消息可靠性，但是由於時間原因，先來說說設計模式中的簡單工廠模式吧！ 在瞭解簡單工廠模式之前，我們要知道C#是一款面向對象的高級程式語言。它有3大特性，封裝、繼承、多態。 ...
  • Nodify學習 一：介紹與使用
    Nodify學習 一：介紹與使用 - 可樂_加冰 - 博客園 (cnblogs.com) Nodify學習 二：添加節點 - 可樂_加冰 - 博客園 (cnblogs.com) 介紹 Nodify是一個WPF基於節點的編輯器控制項，其中包含一系列節點、連接和連接器組件，旨在簡化構建基於節點的工具的過程 ...
  • 使用C#/.NET解析Wiki百科數據實現獲取歷史上的今天
    創建一個webapi項目做測試使用。 創建新控制器，搭建一個基礎框架，包括獲取當天日期、wiki的請求地址等 創建一個Http請求幫助類以及方法，用於獲取指定URL的信息 使用http請求訪問指定url，先運行一下，看看返回的內容。內容如圖右邊所示，實際上是一個Json數據。我們主要解析 大事記 部 ...
  • .NET科普：.NET簡史、.NET Standard以及C#和.NET Framework之間的關係
    最近在不少自媒體上看到有關.NET與C#的資訊與評價，感覺大家對.NET與C#還是不太瞭解，尤其是對2016年6月發佈的跨平臺.NET Core 1.0，更是知之甚少。在考慮一番之後，還是決定寫點東西總結一下，也回顧一下.NET的發展歷史。 首先，你沒看錯，.NET是跨平臺的，可以在Windows、 ...
  • Nodify學習 二：添加節點
    Nodify學習 一：介紹與使用 - 可樂_加冰 - 博客園 (cnblogs.com) Nodify學習 二：添加節點 - 可樂_加冰 - 博客園 (cnblogs.com) 添加節點（nodes） 通過上一篇我們已經創建好了編輯器實例現在我們為編輯器添加一個節點 添加model和viewmode ...
  • 論如何直接用EF Core實現創建更新時間、用戶審計，自動化樂觀併發、軟刪除和樹形查詢（上）
    前言 資料庫併發，數據審計和軟刪除一直是數據持久化方面的經典問題。早些時候，這些工作需要手寫複雜的SQL或者通過存儲過程和觸發器實現。手寫複雜SQL對軟體可維護性構成了相當大的挑戰，隨著SQL字數的變多，用到的嵌套和複雜語法增加，可讀性和可維護性的難度是幾何級暴漲。因此如何在實現功能的同時控制這些S ...
  • C# 使用模式匹配的好處,因為好用所以推薦~
    類型檢查和轉換：當你需要檢查對象是否為特定類型，並且希望在同一時間內將其轉換為那個類型時，模式匹配提供了一種更簡潔的方式來完成這一任務，避免了使用傳統的as和is操作符後還需要進行額外的null檢查。 複雜條件邏輯：在處理複雜的條件邏輯時，特別是涉及到多個條件和類型的情況下，使用模式匹配可以使代碼更 ...
  • 推薦一種批量判斷文件是否存在的快速辦法
    在日常開發中，我們經常需要和文件打交道，特別是桌面開發，有時候就會需要載入大批量的文件，而且可能還會存在部分文件缺失的情況，那麼如何才能快速的判斷文件是否存在呢？如果處理不當的，且文件數量比較多的時候，可能會造成卡頓等情況，進而影響程式的使用體驗。今天就以一個簡單的小例子，簡述兩種不同的判斷文件是否... ...
  • 論如何直接用EF Core實現創建更新時間、用戶審計，自動化樂觀併發、軟刪除和樹形查詢（中）
    前言 資料庫併發，數據審計和軟刪除一直是數據持久化方面的經典問題。早些時候，這些工作需要手寫複雜的SQL或者通過存儲過程和觸發器實現。手寫複雜SQL對軟體可維護性構成了相當大的挑戰，隨著SQL字數的變多，用到的嵌套和複雜語法增加，可讀性和可維護性的難度是幾何級暴漲。因此如何在實現功能的同時控制這些S ...
所有分類