jQuery-篩選器方法、操作標簽、事件

来源:https://www.cnblogs.com/zxr1002/archive/2022/08/29/16637428.html
-Advertisement-
Play Games

JQuery篩選器方法 1.下一個元素 $("#id").next() $("#id").nextAll() $("#id").nextUntil("#i2") 2.上一個元素 $("#id").prev() $("#id").prevAll() $("#id").prevUntil("#i2") ...


目錄

JQuery篩選器方法

1.下一個元素

$("#id").next()
$("#id").nextAll()
$("#id").nextUntil("#i2")

2.上一個元素

$("#id").prev()
$("#id").prevAll()
$("#id").prevUntil("#i2")

3.父親元素

$("#id").parent()
$("#id").parents()  // 查找當前元素的所有的父輩元素
$("#id").parentsUntil() // 查找當前元素的所有的父輩元素，直到遇到匹配的那個元素為止。

4.兒子和兄弟元素

$("#id").children();// 兒子們
$("#id").siblings();// 兄弟們

5.練習展示

Html 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>篩選器方法</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
</head>
<body>
<p>111</p>
<p>222</p>
<div id="d2">div
    <span>444</span>
    <p>div>p
        <span id="d1">div>p>span</span>
    </p>
    <span>333</span>
</div>
<p>555</p>
<p>666</p>
</body>
</html>

1.查找下麵的同級標簽第一個
$divEle.next()
jQuery.fn.init [p, prevObject: jQuery.fn.init(1)]
2.查找下麵同級標簽以下所有標簽
$divEle.nextAll()
jQuery.fn.init(2) [p, p, prevObject: jQuery.fn.init(1)]
3.查找下麵同級別標簽第一個直到.p2為止(不包含最後一個)
$divEle.nextUntil('.p2')
jQuery.fn.init [p, prevObject: jQuery.fn.init(1)]

...

image
image

JQuery操作標簽

1.操作類js與jq的對比

js原生版本														
classList.add()										
classList.remove()								
classList.contains()							
classList.toggle()								


jQuery版本
addClass()			: 添加元素
removeClass()		: 移出某個類屬性	
hasClass()			: 驗證是否包含某個類屬性
toggleClass()		: 有則刪除無則添加

2.操作標簽樣式(鏈式操作)

.css('樣式名','樣式值')		style.樣式名 = '樣式值'

執行鏈式操作

$('p').first().css('color','green').next().css('color','blue')

'原理解析：'
1.jQuery的鏈式操作 使用jQuery可以做到一行代碼操作很多標簽
2.jQuery對象調用jQuery方法之後返回的還是當前jQuery對象 也就可以繼續調用其他方法

image
鏈式操作在python中的本質

1.python代碼實現鏈式操作本質

class MyClass(object):
    def func1(self):
        print('func1')
        // 必須要返回對象
        return self

    def func2(self):
        print('func2')
        return self
obj = MyClass()
obj.func1().func2()

2.jQuery鏈式操作的本質
對象在調用一個方法之後，對象還會返回回來，然後在調用其他方法，以此迴圈 jQuery本質。

3.位置操作

offset()// 獲取匹配元素在當前視窗的相對偏移或設置元素位置
position()// 獲取匹配元素相對父元素的偏移
scrollTop()// 獲取匹配元素相對滾動條頂部的偏移
scrollLeft()// 獲取匹配元素相對滾動條左側的偏移

.offset()方法允許我們檢索一個元素相對於文檔（document）的當前位置。和 .position()的差別在於： .position()是相對於相對於父級元素的位移。
實際操縱練習

右側滾動條距離頂部的長度
$(window).scrollTop()
7142.22216796875

$(window).scrollTop()
9920

$(window).scrollTop()
11475.5556640625

加了參數就是設置(回到頂部)
$(window).scrollTop(0)  
n.fn.init [Window]

$(window).scrollTop(500)
n.fn.init [Window]

image

4.尺寸操作

height()
width()
innerHeight()
innerWidth()
outerHeight()
outerWidth()

操作目標

p {
/*上 右 下 左*/
margin: 1px 2px 3px 4px;
padding: 4px 3px 2px 1px;
}

尺寸操作練習

1.文本高度
$('p').height() 
21

2.文本寬度
$('p').width()  
697

3.文本+padding 內高
$('p').innerHeight()  
27

4.文本+padding 內寬
$('p').innerWidth()   
702

5.文本+padding+border 邊框(未設值)
$('p').outerHeight()  
27

6.文本+padding+border 邊框(未設值)
$('p').outerWidth()   
702

image

5.文本操作

1.操作標簽內部文本

js版本										
innerText	 : 操作文本											
innerHTML	 : 操作文件與標簽 

jQuery版本
text()		: 括弧內不加參數就是獲取加了就是設置(只能操作文本內容)
html()		: 括弧內不加參數就是獲取加了就是設置(能操作文本與標簽)
val()		：取得第一個匹配元素的當前值
val(val)	：設置所有匹配元素的值
val([val1, val2])：設置多選的checkbox、多選select的值

JQuery獲取標簽

$('div').text()
'要有所期待\n    444\n    div>p\n        div>p>span\n    \n    333\n'

$('div').html()
'要有所期待\n    <span>444</span>\n    <p>div&gt;p\n        <span id="d1">div&gt;p&gt;span</span>\n    </p>\n    <span>333</span>\n'

image

text設置文本

$('div').text('我們都是Jason的大寶貝')
jQuery.fn.init [div#d2, prevObject: jQuery.fn.init(1)]

image
HTML設置文本

$('div').html('今天最開心的時刻就是轉頭的那一刻')
w.fn.init [div, prevObject: w.fn.init(1)]

$('div').text('<h1>你們都是我的大寶貝</h1>')
w.fn.init [div, prevObject: w.fn.init(1)]

$('div').html('<h1>我一天天的比你們都緊張</h1>')
w.fn.init [div, prevObject: w.fn.init(1)]

註意:jQuery與js文本規律相同

image

image

6.屬性操作

js版本	
setAttribute()
getAttribute()											
removeAttribute()										

jQuery版本	
attr(name,value)	 : 設置屬性(兩個參數設置)
attr(name)			: 獲取屬性(一個參數獲取)
removeAttr(name)	 : 移出屬性

實操練習

使用變數接收p標簽
let $pELe = $('p')
undefined

獲取id屬性值
$pELe.attr('id')
'd1'

獲取class屬性值為空(標簽內沒有calss屬性)
$pELe.attr('class')
undefined

創建名為class的類屬性值為c1
$pELe.attr('class','c1')
jQuery.fn.init(2) [p#d1.c1, p#d2.c1, prevObject: jQuery.fn.init(1)]0: p#d1.c11: p#d2.c1length: 2prevObject: jQuery.fn.init [document][[Prototype]]: Object(0)

修改id屬性
$pELe.attr('id','newd1')
jQuery.fn.init(2) [p#newd1.c1, p#newd1.c1, prevObject: jQuery.fn.init(1)]0: p#newd1.c11: p#newd1.c1length: 2prevObject: jQuery.fn.init [document][[Prototype]]: Object(0)

移出屬性
$pELe.removeAttr('password')
jQuery.fn.init(2) [p#newd1.c1, p#newd1.c1, prevObject: jQuery.fn.init(1)]

獲取p標簽數據 
$('p')[0]

checkbox使用attr查詢用戶選擇情況
針對選擇按鈕，checkbox radio option這些需要用戶選擇的，你在操作它的屬性的時候，就不要使用attr。

1.查詢id為d3的checked的選擇情況           
$('#d3').attr('checked')  # 無效
"checked"
2.查詢id為d2的checked的選擇情況           
$('#d2').attr('checked')  # 無效
undefined
$('#d2').attr('checked')  # 無效
undefined
$('#d4').attr('checked')  # 無效
undefined
$('#d3').attr('checked')  # 無效
"checked"
3.給id為d3的checked並設置選擇
$('#d3').attr('checked','checked')  # 無效
w.fn.init [input#d3]

對於標簽上有的能夠看到的屬性和自定義屬性用attr
對於返回布爾值比如checkbox radio option是否被選中用prop

專門針對選擇按鈕的參數解決以上無效問題
prop獨有作用:
        用戶選擇	 :  True
        用戶未選擇    :  False

解決checkbox使用attr查詢用戶選擇時(無效問題)

在1.x及2.x版本的jQuery中使用attr對checkbox進行賦值操作時會出bug，在3.x版本的jQuery中則沒有這個問題。為了相容性，我們在處理checkbox和radio的時候儘量使用特定的prop()，不要使用attr("checked", "checked")
checkbox使用prop Html代碼 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>checkbox使用prop</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
</head>
<body>
<input type="checkbox" value="111" name="hobby" id="d2">d2
<input type="checkbox" value="222" name="hobby" checked id="d3">d3
<input type="checkbox" value="333" name="hobby" id="d4">d4
</body>
</html>

1.查詢id為d2的選項是否選擇
$('#d2').prop('checked')
false

2.查詢id為d3查詢的選項是否選擇
$('#d3').prop('checked')
true

3.查詢id為d4查詢的選項是否選擇
$('#d4').prop('checked')
false

4.prop設置值
$('#d3').prop('checked',true)
k.fn.init [input#d3]

5.prop取消值
$('#d4').prop('checked',false)
k.fn.init [input#d4]

image

prop和attr的屬性

attr全稱attribute(屬性)
prop全稱property(屬性)

雖然都是屬性，但他們所指的屬性並不相同，attr所指的屬性是HTML標簽屬性，而prop所指的是DOM對象屬性，可以認為attr是顯式的，而prop是隱式的。

總結一句話就是說，attr只能判斷一些固定的死的，不能去判斷動態的東西，像checked就屬於動態的它不能夠判斷。prop就是專門的去做一些動態的判斷例如：checked、redio、option。

7.文檔處理

添加到指定元素內部的後面

$(A).append(B)// 把B追加到A
$(A).appendTo(B)// 把A追加到B

添加到指定元素內部的前面

$(A).prepend(B)// 把B前置到A
$(A).prependTo(B)// 把A前置到B

添加到指定元素外部的後面

$(A).after(B)// 把B放到A的後面
$(A).insertAfter(B)// 把A放到B的後面

添加到指定元素外部的前面

$(A).before(B)// 把B放到A的前面
$(A).insertBefore(B)// 把A放到B的前面

移除和清空元素

remove()// 從DOM中刪除所有匹配的元素。
empty()// 刪除匹配的元素集合中所有的子節點。

克隆，瞭解知識（clone（））

事件

JQuery綁定事件

JS綁定事件
	標簽對象.on事件名 = function(){事件代碼}
   		btnEle.onclick = function(){alert(123)}
jQuery綁定事件
	方式1
        jQuery對象.事件名(function(){事件代碼})
            $btnEle.click(function(){alter(123)})
	方式2
    	  jQuery對象.on('事件名',function(){事件代碼})
        	  $btnEle.on('click',function(){alter(123)})
 	"""
 	有時候使用jQuery的方式1綁定事件如果無法觸發 可以切換為方式2
 	"""

常用事件

click(function(){...})
hover(function(){...})
blur(function(){...})
focus(function(){...})
change(function(){...})
keyup(function(){...})

克隆事件

預設情況下只會克隆它的標簽，不會克隆它的點擊事件，所以只能第一個點擊進行克隆，而後面克隆出來的不能進行點擊克隆。但是如果想要更完美的克隆就是原封不動的全部克隆出來，就在clone()的括弧里設置true
克隆事件代碼 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <style>
        .c1{
            border: 3px solid greenyellow;
            background-color: khaki;
        }
    </style>
</head>
<body>
<button id="d1" class="c1">哇咔咔！</button>
<script>
    let $btnEle = $('#d1');
    // 克隆事件
    $btnEle.click(function (){
        // this指代的是當前被操作的標簽對象，不能直接點jquery方法的，需要轉換為jQuery對象
        $('body').append($(this).clone(true))  // $(this)是當前按鈕的jquery對象，然後把自己克隆一份，然後把克隆的這一份添加到body中去
    })
</script>
</body>
</html>

image
keydown和keyup事件組合

點擊查看代碼 
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta http-equiv="content-Type" charset="UTF-8">
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <title>Title</title>
</head>
<body>


<table border="1">
  <thead>
  <tr>
    <th>#</th>
    <th>姓名</th>
    <th>操作</th>
  </tr>
  </thead>
  <tbody>
  <tr>
    <td><input type="checkbox"></td>
    <td>Egon</td>
    <td>
      <select>
        <option value="1">上線</option>
        <option value="2">下線</option>
        <option value="3">停職</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><input type="checkbox"></td>
    <td>Alex</td>
    <td>
      <select>
        <option value="1">上線</option>
        <option value="2">下線</option>
        <option value="3">停職</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><input type="checkbox"></td>
    <td>Yuan</td>
    <td>
      <select>
        <option value="1">上線</option>
        <option value="2">下線</option>
        <option value="3">停職</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><input type="checkbox"></td>
    <td>EvaJ</td>
    <td>
      <select>
        <option value="1">上線</option>
        <option value="2">下線</option>
        <option value="3">停職</option>
      </select>
    </td>
  </tr>
  <tr>
    <td><input type="checkbox"></td>
    <td>Gold</td>
    <td>
      <select>
        <option value="1">上線</option>
        <option value="2">下線</option>
        <option value="3">停職</option>
      </select>
    </td>
  </tr>
  </tbody>
</table>

<input type="button" id="b1" value="全選">
<input type="button" id="b2" value="取消">
<input type="button" id="b3" value="反選">


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

    var flag = false;
    // shift按鍵被按下的時候
    $(window).keydown(function (event) {
        console.log(event.keyCode);
        if (event.keyCode === 16){
            flag = true;
        }
    });
    // shift按鍵被抬起的時候
    $(window).keyup(function (event) {
        console.log(event.keyCode);
        if (event.keyCode === 16){
            flag = false;
        }
    });
    // select標簽的值發生變化的時候
    $("select").change(function (event) {
        // 如果shift按鍵被按下，就進入批量編輯模式
        // shift按鍵對應的code是16
        // 判斷當前select這一行是否被選中
        console.log($(this).parent().siblings().first().find(":checkbox"));
        var isChecked = $(this).parent().siblings().first().find(":checkbox").prop("checked");
        console.log(isChecked);
        if (flag && isChecked) {
            // 進入批量編輯模式
            // 1. 取到當前select選中的值
            var value = $(this).val();
            // 2. 給其他被選中行的select設置成和我一樣的值
            // 2.1 找到那些被選中行的select
            var $select = $("input:checked").parent().parent().find("select")
            // 2.2 給選中的select賦值
            $select.val(value);
        }
    });
</script>
</body>
</html>

image

hover事件

點擊查看代碼 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <style>
        .c1{
            border: 3px solid greenyellow;
            background-color: khaki;
        }
    </style>
</head>
<body>
<button id="d1" class="c1">哇咔咔！</button>
<p>壓在我頭上是吧</p>
<script>
    let $btnEle = $('#d1');
    // 克隆事件
    $btnEle.click(function (){
        // this指代的是當前被操作的標簽對象，不能直接點jquery方法的，需要轉換為jQuery對象
        $('body').append($(this).clone(true))  // $(this)是當前按鈕的jquery對象，然後把自己克隆一份，然後把克隆的這一份添加到body中去
    })
    $('p').hover(function (){
        alert('你只能在下麵呆著')
    },
    function (){
        alert('那好吧，，那我走了')
    })
</script>
</body>
</html>

image
監聽事件

點擊查看代碼 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <style>
        .c1 {
            border: 3px solid greenyellow;
            background-color: khaki;
        }
    </style>
</head>
<body>
<input type="text" id="d1">

<script>
    $('#d1').on('input', function () {
        console.log(this.value)
    })
</script>
</body>
</html>

image

阻止後續事件執行

能夠觸發form表單提交數據動作的標簽有兩個
	 <input type="submit">
  	 <button></button>
給已經有事件的標簽綁定事件 會先執行綁定的 再去執行預設的
	我們也可以讓標簽之前的事件不執行
    	return false

$(':submit').click(function (e){
            alert('一定要細心 千萬不要慌!!!')
            // return false  方式1
            e.preventDefault()方式2
        })
點擊查看代碼 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <style>
        .c1 {
            border: 3px solid greenyellow;
            background-color: khaki;
        }
    </style>
</head>
<body>
<p>
    username: <input type="text" name="username">
</p>
<input type="submit" value="提交"><button id="b1">點我</button>


<script>
    $(":submit").click(function (e) {
        alert(123);
        //return false;
        e.preventDefault();
    });
</script>
</body>
</html>

image

image
冒泡事件
涉及到標簽嵌套並且有相同事件的時候 那麼會逐級往上反饋並執行
image

點擊查看代碼 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <style>
        .c1 {
            border: 3px solid greenyellow;
            background-color: khaki;
        }
    </style>
</head>
<body>
<div>div
    <p>div>p
        <span>div>p>span</span>
    </p>
</div>

<script>
    $('div').click(function (){
        alert('div')
    })
    $('p').click(function (){
        alert('p')
    })
    $('span').click(function (e){
        alert('span')
        // return false  // 方式一
        e.stopPropagation()  // 方式二
    })
</script>
</body>
</html>

事件委托

"""
創建標簽的兩種方式
	JS
		document.createElement()
	jQuery
		$('<標簽名>')
"""
事件綁定預設情況下是不會對動態創建的標簽生效的 如果想生效需要事件委托
$('div').on('click','button',function () {
            alert('委托事件啦')
        })

將div標簽里的所有點擊事件都委托給button標簽執行

上述方式就可以解決動態標簽事件的執行問題(註意委托指得是標簽內部的標簽)

image


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

-Advertisement-
Play Games
更多相關文章
  • ClickHouse與Elasticsearch壓測實踐
    ClickHouse 是一個真正的列式資料庫管理系統（DBMS)。在 ClickHouse 中，數據始終是按列存儲的，包括矢量（向量或列塊）執行的過程。只要有可能，操作都是基於矢量進行分派的，而不是單個的值，這被稱為«矢量化查詢執行»，它有利於降低實際的數據處理開銷。 ...
  • MongoDB，入門看這一篇足矣！
    一、介紹 在介紹 MongoDB 之前，我先介紹一下業務開發的時候遇到的痛點，以便大家對它有一個更加清晰的認識！ 最近在用資料庫存儲數據的時候發現這麼一個坑，例如從消息隊列中監聽消息的時候，原來的做法是將監聽的消息數據存儲在資料庫，以便好對異常消息數據進行追溯，消息內容使用text類型存儲，起初因為 ...
  • Oracle用戶創建、賦權、查詢及刪除操作
    首發微信公眾號：SQL資料庫運維 原文鏈接：https://mp.weixin.qq.com/s?__biz=MzI1NTQyNzg3MQ==&mid=2247485212&idx=1&sn=450e9e94fa709b5eeff0de371c62072b&chksm=ea37536cdd40da7 ...
  • Mysql8.0修改lower_case_table_names參數導致重啟失敗
    GreatSQL社區原創內容未經授權不得隨意使用，轉載請聯繫小編並註明來源。 GreatSQL是MySQL的國產分支版本，使用上與MySQL一致。 事件起因：在測試一個數據遷移工具時，源端oracle19c數據遷移到目標端mysql8.0，提示遷移目標端 Unknown database 'SBTE ...
  • 攜手HMS Core統一掃碼服務, 興業證券優理寶App提升用戶掃碼體驗
    興業證券優理寶App聯合華為HMS Core，集成HMS Core統一掃碼服務，在提升掃碼成功率的同時，還支持C端用戶用手機端APP掃描手錶端二維碼，實現行情在手機與手錶間跨終端流轉，行情信息，抬腕可見，為用戶提供貼心金融服務。 為保持品牌色調一致性，興業證券在活動中會使用金色二維碼，在接入HMS ...
  • 個人對 JavaScript 閉包的理解
    作用域的概念 同級作用域 在一個作用域中聲明相同名稱的變數會發生變數名衝突的問題。假如在作用域 A 中聲明一個變數 a，作用域 B 也聲明一個變數 a，兩個作用域的變數都互不影響。 // 作用域 A { let a = 0; console.log(a); } // 作用域 B { let a = ...
  • 【Vue面試題】談談你對Vue的diff演算法的理解
    1 diff演算法到底是什麼？ diff演算法是一種通過同層的樹節點進行比較的高效演算法，它可以不用頻繁操作DOM，而是選用虛擬DOM節點操作，說人話就是專門用來處理虛擬DOM節點的。 2 操作流程? 為了更好理解Vue的diff演算法，請先看一位B站大佬精心製作的 動畫演示。 通過上面視頻可以很好理解di ...
  • 徹底弄懂bind，apply，call三者的區別 (轉)
    為什麼要改變this指向？ 我們知道bind，call，apply的作用都是用來改變this指向的，那為什麼要改變this指向呢？請看下麵的例子: var name="lucy"; let obj={ name:"martin", say:function () { console.log(this ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發（一）：使用.NET MAUI開發第一個安卓APP
    移動開發（一）：使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說，近來想嘗試開發一款安卓APP，考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP，畢竟是使用Visual Studio開發工具，使用起來也比較的順手，結合微軟官方的教程進行了安卓 ...
  • wpf ToggleButton選中效果和一個登錄界面
    前言 QuestPDF 是一個開源 .NET 庫，用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫，它徹底改變了我們生成 PDF 文檔的方 ...
  • 彈幕樹洞項目功能新增篇
    項目地址 項目後端地址： https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址： ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址： http://tree ...
  • 第27篇 sqlserver2022詳細安裝步驟
    話不多說，直接開乾 一.下載 1.官方鏈接下載： https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe，運行開始下載SQL server； 二. ...
  • .NET 開源高性能 MQTT 類庫
    前言 隨著物聯網（IoT）技術的迅猛發展，MQTT（消息隊列遙測傳輸）協議憑藉其輕量級和高效性，已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫，為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog文檔翻譯系列（六） - 可用的接收器、增強器、格式化輸出
    Serilog支持多種接收器用於日誌存儲，增強器用於添加屬性，LogContext管理動態屬性，支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項，適用於不同需求。 ...
  • 警惕 Visual Studio 屬性求值副作用導致邏輯不符合預期
    目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據，爬取信息時需要模擬瀏覽器行為，否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下： 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • [使用目前最新版]HybridCLR6.9.0+YooAsset2.2.4實現純C# Unity熱更新方案 (一)
    1.前言 什麼是熱更新 游戲或者軟體更新時，無需重新下載客戶端進行安裝，而是在應用程式啟動的情況下，在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR，Xlua，ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles，Addressable， ...
  • 在 ASP.NET Core Web API 中使用操作篩選器統一處理通用操作
    本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺，其實像阿裡雲，騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後，它會送 ...
  • 第28篇 如何.net中實現高效可靠數據同步api
    通過以下方式可以高效，並保證數據同步的可靠性 1.API設計 使用RESTful設計，確保API端點明確，並使用適當的HTTP方法（如POST用於創建，PUT用於更新）。 設計清晰的請求和響應模型，以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證，確保接收到的數據符合預期格 ...
所有分類