scrollTop()函数用于设置或返回当前匹配元素相对于垂直滚动条顶部的偏移。
$(function () {
var _top = document.documentElement.scrollTop || document.body.scrollTop; //兼容性
//document.documentElement.scrollTop=0<===>{scrollTop:0}
$(window).scrollTop(1000);//$('html,body').scrollTop(1000)
var $top = $(window).scrollTop();//获取当前窗口滚动条的位置
console.log($top);
})
demo scrollTop();
//对象为body,html为了解决兼容性的问题;
$(function(){
$('#button').on('click',function(){
$('body,html').animate({scrollTop:0},1000,function(){
alert(11111);
})
})
});
hasClass判断当前对象是否含有这个类名;有就返回true,木有就false;
var hover=$('#ul>li').hasClass('hover');
for(let i=0;i<$('#ul>li').length;i++){
if($('#ul>li').eq(i).hasClass('hover')){
$('#ul>li').eq(i).addClass('hover');
}
}
<div class="demo demomo" id="demomo">
<h5>1</h5><h5>2</h5><h5>3</h5><p></p><p></p><p></p><p></p><p></p><p></p></div>
var demomos=$('.demomo').children();
var demomoss=document.getElementById('demomo').childNodes;
console.log(demomos);9
console.log(demomoss);
children():有几个就是显示几个;
childNodes;换行,空格都要算在其中的(text)就会算在其中的,就会增加孩子,长度就会增加;原生js的方法;
<div id="container">
<div>
<h3>1</h3>
<h4>11</h4>
</div>
<div>
<h3>2</h3>
<h4>22</h4>
</div>
<div>
<h3>3</h3>
<h4>33</h4>
</div>
</div>
$(function(){
$('#container h3').on('click',function(){
$(this).next().slideToggle();//显示的隐藏,隐藏的显示
$(this).parent().siblings().children('h4').slideUp();//
slideUp隐藏;
})
});
$(function(){
$('.div').on('click',function(){
alert(1111);
});
$('#btn').on('click',function(){
alert(222);
$('.div').off('click');//off():方法来移除div绑定的click事件;
})
})
$(function(){
$('.div').on('click',function(){
alert(1111);
});
$('#btn').on('click',function(){
$('.div').trigger('click');//trigger:在每个匹配元素上触发指定类型的事件。当按钮点击后。先alert(111),然后在alert(222);
alert(2222);
})
})
原生js的ajax格式
var xhr=new XMLHttpRequest();
xhr.open('GET','datas/movie.json');//路径,需要放在服务器下面;
xhr.send(null);
xhr.onreadystatechange=function(){
if(xhr.status==200 && xhr.readyState==4){
var res=xhr.responseText;
res=JSON.parse(res);
console.log(res);
}
}
jq的ajax格式:
$(function(){
$.get(
'datas/movie.json',//待发送请求的地址
{id:555,name:'zhangsan'},//发送给服务端的键值对
function(data){//回调函数,接收响应数据
console.log(data);
},
'json'//规定返回的数据格式 xml text json script...
)
})
get和post格式都是一样的;
$.ajax({
type:'post',
url:'php/data.php',
data:'admin='+ad+'&pwd='+pd,
success:function(d){
console.log(d);
},
dataType:'json'
});
//这种格式也是对的;