// 获取文本属性
$(‘#d1‘).attr(‘s1‘) // 获取属性值
$(‘#d1‘).attr(‘s1‘,‘haha‘) // 设置属性值
$(‘#d1‘).attr({‘num‘:50,‘taidi‘:‘gay‘}) // 设置多个属性
$(‘#d1‘).removeAttr(‘taidi‘) // 删除一个属性
// 获取check与radio标签的checked属性
$(‘#i1‘).prop(‘checked‘)
$(‘#i1‘).prop(‘checked‘,true)
prop 和attr 的区别:
attr全称attribute(属性)
prop全称property(属性) (返回一个bool值)
虽然都是属性,但他们所指的属性并不相同,attr所指的属性是HTML标签属性,而prop所指的是DOM对象属性,可以认为attr是显式的,而prop是隐式的。
例子
$("#i1").attr("me") // "自定义属性"
$("#i1").prop("me") // undefined
// 标签内部尾部追加元素
$(‘#d1‘).append(pEle)
$pEle.appendTo($(‘#d1‘))
// 标签内部头部添加元素
$(‘#d1‘).prepend(pEle)
$pEle.prependTo($(‘#d1‘))
// 标签外部下面添加元素
$(A).after(B)// 把B放到A的后面
$(A).insertAfter(B)// 把A放到B的后面
// 标签外部上面添加元素
$(A).before(B)// 把B放到A的前面
$(A).insertBefore(B)// 把A放到B的前面
// 替换标签
replaceWith() // 什么被什么替换
replaceAll() // 拿什么替换什么
// 克隆事例
<button id="b2">屠龙宝刀,点击就送</button>
// clone方法加参数true,克隆标签并且克隆标签带的事件
$("#b2").on("click", function () {
$(this).clone(true).insertAfter(this); // true参数
});
// click事件以上面的克隆案例为参考
// hover事件
$(‘p‘).hover( // 写两个函数一个表示鼠标移进去,另一个标示鼠标移出来
function () {
alert(‘来啦,老弟‘)
},
function () {
alert(‘慢走哦~‘)
}
)
// input实时监听
$(‘#i1‘).on(‘input‘,function () {
console.log($(this).val())
});
// focus/blur 其他同理js事件
// 取消标签默认的事件
return false
$(‘input‘).click(function (e) {
alert(123);
// return false
e.preventDefault();
});
// 事件冒泡
div>p>span // 三者均绑定点击事件
$("span").click(function (e) {
alert("span");
e.stopPropagation(); // 阻止事件冒泡
});
// 事件委托
<button>按钮</button>
<script src="jQuery-3.3.1.js"></script>
<script>
$(‘body‘).on(‘click‘,‘button‘,function () {
alert(123)
})
</script>
$(document).ready(function(){
// 在这里写你的JS代码...
})
$(function(){
// 你在这里写你的代码
})
// 标签记得设置高和宽 $(‘img‘).hide(5000) $(‘img‘).show(5000) $(‘img‘).slideDown(5000) $(‘img‘).slideUp(5000) $(‘img‘).fadeIn(5000) $(‘img‘).fadeOut(5000) $(‘img‘).fadeTo(5000,0.4)
$.each(array,function(index){
console.log(array[index])
})
$.each(array,function(){
console.log(this);
})
// 支持简写
$divEles.each(function(){
console.log(this) // 标签对象
})
$("div").data("k",100);//给所有div标签都保存一个名为k,值为100
$("div").data("k");//返回第一个div标签中保存的"k"的值
$("div").removeData("k"); //移除元素上存放k对应的数据
原文:https://www.cnblogs.com/king-home/p/10975920.html