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








 类似资料: