1、给标签的某个属性赋值,获取某个属性的值
$('#id').attr('属性','值');
$('#id').attr('属性');
documnet.getElementById('').getAttribute("");
documnet.getElementById('').setAttribute('属性','值');
//例如
<input id="range" type="range" min="0" value="0" class="slider" oninput="change()" />
$('#range').attr('max','100'); //赋值
$('#range').attr('max');//获取值
2、修改样式、添加类
$('#id').addClass("类名");//添加类
$('.类名').css('样式','值');//修改样式
3、.eq()和:eq()
<ul>
<li class="slider">1</li>
<li class="slider">2</li>
<li class="slider">3</li>
<li class="slider">4</li>
<li class="slider">5</li>
</ul>
//eq() 方法将匹配元素集缩减值指定 index 上的一个
//使用.eq()方法,里面放变量或者是数字都可以
$('.slider').eq(0);//选取类为slider的第一个元素
let index = 1;
$('.slider').eq(index);
//:eq()里面只能是变量,不能写:eq(index),他会把index认为是一个字符串
$(".slider:eq(" + index + ")");
4、判断一个div是否为空,是否含有其他元素children()
//判断元素的子元素长度是否为0 $('#id').children().length === 0
<div id="list"></div>
if( $('#list').children().length === 0 ){
$('#list').hide();
}else {
$('#list').show();
}
5、展示遍历列表数据
<div id="list"></div>
data.forEach((item,index)=> {
let html = '<div οnclick="toLink(\'' + item.link + '\')">'+
'<img src="'item.src'" />'+
'<span class="name">'+ item.name +'</span>'+
'</div>'
$('#list').append(html);
})
6、获取链接后面的参数方法
//获取地址栏的参数
function getParams(variable){
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=");
if(pair[0] == variable){
return pair[1];
}
}
return '';
}
//用法:
let id = getParams('id');
7、ajax请求
//ajax默认的ContentType的值为:application/x-www-form-urlencoded;
//application/json和application/x-www-form-urlencoded两者主要是在传参上面有区别,写的时候要注意一下
1、ContentType的值为:application/x-www-form-urlencoded;时
$.ajax({
type: 'POST',
dataType: 'JSON',
url: '/jf/security/loginUserBase',
traditional: true,
data: {},
success: function (res) {
},
error:function(error){
},
});
2、ContentType的值为:application/json;时
$.ajax({
type: "POST",
dataType: 'JSON',
url: "/jf/querybenefitsnosession/queryBenefits",
contentType: 'application/json',
traditional: true,
data: JSON.stringify({
}),
success: function (res) {
},
error:function(error){
},
});
8、页面跳转
//js直接跳转
(1)、window.location.href = '跳转链接';
(2)、window.navigate("页面链接");
//js定时跳转
(3)、setTimeout("javascript:location.href='跳转链接'", 2000);
//返回上一级
(4)、window.history.go(-1);
(5)、window.history.back();