1.jQuery.extend()方法 用于将一个或多个对象的内容合并到目标对象。
语法:$ .extend( [deep ], target, object1 [, objectN ] )
deep为true表示深度合并,为false为浅度合并
object1可选。 Object类型 第一个被合并的对象。
objectN 可选。 Object类型 第N个被合并的对象。
2.jQuery.fn.extend()方法
$.fn.extend() 函数为jQuery扩展一个或多个实例属性和方法(主要用于扩展方法)。
jQuery.fn是jQuery的原型对象,其extend()方法用于为jQuery的原型添加新的属性和方法。这些方法可以在jQuery实例对象上调用。
语法: $ .fn.extend( object )
object:Object类型 指定的对象,用来合并到jQuery的原型对象上。
<button id="btn1">全选</button>
<!-- <button id="btn2">取消全选</button> -->
<h1>爱好</h1>
睡觉:<input type="checkbox" name="" id=""><br>
网吧<input type="checkbox" name="" id=""><br>
熬夜<input type="checkbox" name="" id=""><br>
<script src="./jquery-3.6.0.js"></script>
<script>
$.fn.extend({
checked: function () {
this.each(function (i, e) {
e.checked = true
})
},
checkedIn: function () {
this.each(function (i, e) {
e.checked = false
// e.checked=''
})
}
})
/* $("#btn1").click(function(){
$('input').checked()
})
$("#btn2").click(function(){
$('input').checkedIn()
}) */
var flag = true
$("#btn1").click(function () {
if (flag) {
$(this).text("取消全选");
$('input').checked();
}
else {
$(this).text("全选");
$('input').checkedIn();
}
flag = !flag;
})
三:## 原生转成jq对象
let h1=document.querySelector('h1') */
/* jq对象转原生的方法 */
/* 第一种 $(h1)[0] */
/* 使用$(h1).get(0)方法,可以把单个的jq元素转成原生DOM元素.
四:自创jq文件
自制jq
<style>
.div1{
width: 150px height: 100px; border: 1px solid black; }
.blue{ background-color: blue; } </style>
</head>
<body>
/* $('div').css('background','red') */
$('div').hide()
$('div').show()
$('div').addClass('blue')
/* $('div').removeClass('blue') */
$('div').click(function(){
alert('成功')
})
JS文件
(function(){
function $(elem){
let ele=document.querySelector(elem)
ele.css=function(key,value){
this.style[key]=value
}
ele.show=function(){
this.style.display='block'
}
ele.hide=function(){
this.style.display='none'
}
ele.addClass=function(className){
this.className=this.className+' '+className
}
ele.removeClass=function(className){
this.className=this.className.replace(className,'');
}
ele.click=function(qq){
this.onclick=qq
}
return ele
}
/* 把局部的方法$ 挂载到window上变成全局的 */
window.
})()