自定义jquery方法
/**
* 元素禁用使用
* @author M1nG
* @param 要禁用的毫秒值 默认1500 即为1.5s
* @description 可以用来防止连续点击 示例 $("XX").ban();
*/
;(function ($) {
$.fn.extend({
ban: function (options) {
if (typeof (options) == "number") defaluts = parseInt(options);
return this.each(function () {
var $this = $(this);
$this.addClass("ban");
setTimeout(function () {
$this.removeClass("ban");
}, defaluts);
});
},
});
var defaluts = 1500;
})(jQuery);
互转
$(DOM对象) 就是jQuery对象
$ ("#txtName")[0] 就是DOM对象
// 按注册的顺序调用， 先注册先调用 ， 可以嵌套
// 等同于 $(document).readu(), 但是高版本里已经启用。
$(function () {
$(function () {
//这里是在第二轮调用
})
});<script type="application/javascript" src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>
$() 一直都是一个数组, 除了用id之外
is()用法，next（）用法
if($(".cur").is("div:last")){
$(".cur").removeClass("cur");
$("div:first").addClass("cur");
}else{
$(".cur").removeClass("cur").next().addClass("cur");//添加类选择器
}
切换可见状态
$("li:gt(5):not(:last)").toggle();
获取元素上的事件
var $events = $._data(oDrag[0], 'events');
if ($events && $events["mousedown"]) {
oDrag.css("cursor", "default");
oDrag.draggable("disable");
dragToggleBtn.text("解锁")
}
css()
css(name,value)
css({name:value, name:value,name:value…})
后面不带值就是读取值
addClass()
addClass(“class1 class2 … classN”)
toggleClass()
节点操作
val() 针对input标签
document.write() 这个方法只有document有element.innerText=""$("p").html("Hello");//全部替换$("p").append("world")
创建节点元素
$(selector)：通过选择器获取节点
$(element)：把DOM节点转化成jQuery节点
$(html)：使用HTML字符串创建jQuery节点 $(“<li title=‘标题为千与千寻’>千与千寻</li>”)
替换
$(A).replaceWith(B) 把A用B替换掉
$(A).replaceAll(B) 把A用来替换掉所有的B
复制粘贴
$("ul li:eq(1)").clone(true).appendTo("ul");
所以区别就是detach删除再添加回去事件还在。（删除之后再在同样位置添加同样标签事件会不会生效？？？）
isNAN
是不是非数字 is not a number?
$("#show").removeAttr("style"); //ie,ff均支持
$("." + this.bigimg).attr("src", dataURL).fadeIn().load(function () {//imgSrc是图片地址
$("." + this.bigimg).css({
height: realHeight,
width: realWidth,
});
$(".imgNotify" + time).removeClass("showing")
$(".imgNotify" + time).addClass("showing")<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
<script src="https://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.2.min.js">
<script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js">
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>$('div.noview').hide()
a.items[0].name
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).parent().parent().addClass("disabled")); })
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).parent().parent().removeClass("disabled")); })
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).hide()); })
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).show()); })
<label>
<input type="checkbox" name="item" onchange="childOrLadySelect('child',this)">
有小孩
</label>
function childOrLadySelect(which, value) {
console.log(which)
console.log($(value).is(':checked'))
temp=null;
if(which==='child')
temp=$("#mySelect").find("span.tagChild")
else if(which==='lady')
temp=$("#mySelect").find("span.tagLady")
else
return;
if($(value).is(':checked')){
temp.each(function () { ($(this).parent().parent().addClass("disabled")); })
temp.each(function () { ($(this).show()); })
}else{
temp.each(function () { ($(this).parent().parent().removeClass("disabled")); })
temp.each(function () { ($(this).hide()); })
}
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).parent().parent().addClass("disabled")); })
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).parent().parent().removeClass("disabled")); })
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).hide()); })
$("#mySelect").find("span.tagChild").each(function () { console.log($(this).show()); })
}
attr 和 prop 区别
经过在网上搜素和测试总结
prop()函数的结果:
1.如果有相应的属性，返回指定属性值。
2.如果没有相应的属性，返回值是空字符串。
attr()函数的结果:
1.如果有相应的属性，返回指定属性值。
2.如果没有相应的属性，返回值是undefined。
对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。
具有 true 和 false 两个属性的属性，如 checked, selected 或者 disabled 使用prop()
评论区