jquery/js常用
商和颂
2023-12-01
1.查找元素
var div = $("<div><div>1</div><div>2</div><div>3</div><div>4</div><div>5</div></div>"); //外层div包含5个子div 返回一个对象
var divfindlist = div.find("div");//返回对象集合 5个子div
var divchildrenlist = div.children("div");//返回对象集合 5个子div
var div = $("<div>1</div><div>2</div><div>3</div><div>4</div><div>5</div>"); //5个div 返回对象的集合
var divfindlist = div.find("div");//返回空值
var divchildrenlist = div.children("div");//返回空值
//查找元素 具有特定属性
var imageunloaslist=$("<div><image _load='falst'/><image _load='falst'/><image _load='true'/></div>").find("img[_load=false]");
2.为元素或则新增加的元素注册事件 --bind
$returnList.find('.messagelist-ms-delete').bind('click', function () {
deleteMsg($(this));
});
3.获取元素的属性 --attr
$(this).attr('class')
4.为元素添加/删除样式
$(this).addClass('class') $(this).removeClass('class');
4.1设置元素样式
$(this).css('display','inline');
5.循环对象集合 操作每个对象 --$.each(list,function(i,n))
$.each($("<div>1</div><div>2</div><div>3</div>"),function(i,n){ //i为索引 n为伪对象 须加美元符号变为jquery对象
$(n).attr('class');//变为jquery对象获取属性
});
6.将json字符窜变为json对象
var json=eval("("+strjson+")");
7.上传文件选择完成事件 <input name="imagename" class="onepicturemessage-right-file" type="file"/> 记得要加name属性 否则后台获取不了上传的文件集合
$('<input name="imagename" class="onepicturemessage-right-file" type="file"/>').change(function(){
alert(1);
});
8.创建定时执行器和消除定时执行器
var timer=window.setInterval(function(){alter(1);},500);
window.clearInterval(timer);
9.字符窜的各种函数
1.截取 str.substring(开始位置,截取长度)
2.替换 str.replace(被替换,替换)
3.去取空格$.trim(str)
4.获取子字符窜的位置 str.indexOf('1') //不存在返回-1
10.数组的操作
1.push 在数组末尾添加元素,并返回新数组的长度
2.pop 先进后出的栈功能 返回删除的元素
3.unshift 在数组开头添加元素,并返回新数组的长度
4.splice(开始位置,长度) 删除数组元素
11.获取window的frame
window.frames[1]
12.javascript的对象为引用对象
function getElement(list){retrun list[0];} //定义方法 获取数组的第一个对象
var list0=getElement(this);
list0.name="bill";修改元素 直接修改数组对象的元素
13.下拉框事件 --select元素
$("<select><option value="1" selected="selected">1</option></select>").change(function(){alert(1);});
14.滚动条下拉事件
var range = 200; //距下边界长度/单位px
$(window).scroll(function () {
var srollPos = $(window).scrollTop(); //滚动条距顶部距离(页面超出窗口的高度)
totalheight = parseFloat($(window).height()) + parseFloat(srollPos); //浏览器高度+滚动条距顶部距离高度
if (($(document).height() - range) <= totalheight + 500 && readnext == true) {//页面文档高度-距下边界高度<浏览器高度+滚动条距顶部距离高度
//g_loading();
$.ajax({ "type": "POST", "url": "/message/getnextpagemessage.ajax", "data": { "jsonmsg": $.toJSON(jsonpagestatus) }, "async": false,
success: function (msg) {
//return;
var returnJson = eval("(" + msg + ")");
//returnJson.status 1=成功获取信息 2=没有消息获取 3=获取消息出错 4=页面请求错误
if (returnJson.status == 1) {
var $returnList = $(returnJson.returnHtml);
$('#messagelist').append($returnList).masonry('appended', $returnList);
GetImage();
jsonpagestatus = returnJson.returnJsonObj;
//注册删除事件
$returnList.find('.messagelist-ms-delete').bind('click', function () {
deleteMsg($(this));
});
//注册编辑事件
$returnList.find('.messagelist-ms-edit').bind('click', function () {
window.location.href = $(this).attr("_href");
});
}
else if (returnJson.status == 2) {
readnext = false;
}
}
});
//g_removeLoading();
}
});
15.跳转页面
window.location.href="";
16.获取子元素 第几个
var div = $("<div><div>1</div><div>2</div><div>3</div><div>4</div><div><input type='text' value='1'></div></div>"); //外层div包含5个子div 返回一
个对象
var div5=div.children('div:nth-child(4)');//获取第5个div对象
var input=div5.find('input');//获取第5个div对象的input元素
var text=input.val();获取第5个div对象的input元素的text