JQUERY方法： 方法原型：$(selector).bind(event,data,function,map)selector的语法参照jquery选择器语法参数描述event必需。规定添加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。data可选。规定传递到函数的额外数据。function必需。规定当事件发生时运行的函数。map规定事件映射({event:function,event:function,...})，包含要添加到元素的一个或多个事件，以及当事件发生时运行的函数。$("#room").bind("inputpropertychange",function(){alert($(this).val());});测试后以上代码是监听input标签的oninput和onporpertychange事件，参照网上查阅的资料这两个事件必须同时监听，具体原理未深入了解，写在标签属性的写法如下<inputtype="text"id="a"oninput="aa()"onporpertychange="aa()"/><scripttype="text/JavaScript">functionaa(){alert("inputting!!");}</script>此事件只能监听键盘输入的内容，如果是在脚本中改变input的value值不会触发事件
jquery获取checkbox选中的值，包括全选取消全选反选选中奇数行获取选中的值这里有一个注意点：使用attr(),会发现代码那里的checked="checked",但是页面input上没有显示出来，所以改成使用prop<inputtype="checkbox"name="xpz"value="1"/>苹果<inputtype="checkbox"name="xpz"value="2"/>橘子<inputtype="checkbox"name="xpz"value="3"/>梨子<inputtype="checkbox"name="xpz"value="4"/>香蕉<br/><br/><inputtype="button"id="btn1"value="全选"><inputtype="button"id="btn2"value="取消全选"><inputtype="button"id="btn3"value="选中所有奇数"><inputtype="button"id="btn4"value="反选"><inputtype="button"id="btn5"value="获得选中的所有值">$("#btn1").on("click",function(){$("[name='xpz']").prop("checked",'checked');//全选});$("#btn2").on("click",function(){$("[name='xpz']").removeAttr("checked");//取消全选})$("#btn3").click(function(){$("[name='xpz']:even").prop("checked",'true');//选中所有奇数})$("#btn4").click(function(){$("[name='xpz']").each(function(){this.checked=!this.checked;})})$("#btn5").click(function(){varchk_value=[];//定义一个数组$('input[name="xpz"]:checked').each(function(){//遍历每一个名字为nodes的复选框，其中选中的执行函数chk_value.push($(this).val());//将选中的值添加到数组chk_value中});varselectId=chk_value.join(",");alert(selectId);})
Attribute$("p").addClass(css中定义的样式类型);给某个元素添加样式$("img").attr({src:"test.jpg",alt:"testImage"});给某个元素添加属性/值，参数是map$("img").attr("src","test.jpg");给某个元素添加属性/值$("img").attr("title",function(){returnthis.src});给某个元素添加属性/值$("元素名称").html();获得该元素内的内容（元素，文本等）$("元素名称").html("<b>newstuff</b>");给某元素设置内容$("元素名称").removeAttr("属性名称")给某元素删除指定的属性以及该属性的值$("元素名称").removeClass("class")给某元素删除指定的样式$("元素名称").text();获得该元素的文本$("元素名称").text(value);设置该元素的文本值为value$("元素名称").toggleClass(class)当元素存在参数中的样式的时候取消,如果不存在就设置此样式$("input元素名称").val();获取input元素的值$("input元素名称").val(value);设置input元素的值为valueManipulation$("元素名称").after(content);在匹配元素后面添加内容$("元素名称").append(content);将content作为元素的内容插入到该元素的后面$("元素名称").appendTo(content);在content后接元素$("元素名称").before(content);与after方法相反$("元素名称").clone(布尔表达式)当布尔表达式为真时，克隆元素（无参时，当作true处理）$("元素名称").empty()将该元素的内容设置为空$("元素名称").insertAfter(content);将该元素插入到content之后$("元素名称").insertBefore(content);将该元素插入到content之前$("元素").prepend(content);将content作为该元素的一部分，放到该元素的最前面$("元素").prependTo(content);将该元素作为content的一部分，放content的最前面$("元素").remove();删除所有的指定元素$("元素").remove("exp");删除所有含有exp的元素$("元素").wrap("html");用html来包围该元素$("元素").wrap(element);用element来包围该元素Traversingadd(expr)add(html)add(elements)children(expr)contains(str)end()filter(expression)filter(filter)find(expr)is(expr)next(expr)not(el)not(expr)not(elems)parent(expr)parents(expr)prev(expr)siblings(expr)Core$(html).appendTo("body")相当于在body中写了一段html代码$(elems)获得DOM上的某个元素$(function(){……..});执行一个函数$("div>p").css("border","1pxsolidgray");查找所有div的子节点p，添加样式$("input:radio",document.forms[0])在当前页面的第一个表单中查找所有的单选按钮$.extend(prop)prop是一个jQuery对象，举例：jQuery.extend({min:function(a,b){returna<b?a:b;},max:function(a,b){returna>b?a:b;}});jQuery(expression,[context])---$(expression,[context]); 在默认情况下，$()查询的是当前HTML文档中的DOM元素。each(callback)以每一个匹配的元素作为上下文来执行一个函数举例：1$("span").click(function(){$("li").each(function(){$(this).toggleClass("example");});});举例：2$("button").click(function(){$("div").each(function(index,domEle){//domEle==this$(domEle).css("backgroundColor","yellow");if($(this).is("#stop")){$("span").text("Stoppedatdivindex#"+index);returnfalse;}});});jQueryEventready(fn);$(document).ready()注意在body中没有onload事件，否则该函数不能执行。在每个页面中可以有很多个函数被加载执行，按照fn的顺序来执行。bind(type,[data],fn)为每一个匹配元素的特定事件（像click）绑定一个或多个事件处理器函数。可能的事件属性有：blur,focus,load,resize,scroll,unload,click,dblclick,mousedown,mouseup,mousemove,mouseover,mouseout,mouseenter,mouseleave,change,select,submit,keydown,keypress,keyup,error。one(type,[data],fn)为每一个匹配元素的特定事件（像click）绑定一个或多个事件处理器函数。在每个对象上，这个事件处理函数只会被执行一次。其他规则与bind()函数相同。trigger(type,[data])在每一个匹配的元素上触发某类事件。triggerHandler(type,[data])这一特定方法会触发一个元素上特定的事件(指定一个事件类型)，同时取消浏览器对此事件的默认行动。unbind([type],[data])反绑定，从每一个匹配的元素中删除绑定的事件。$("p").unbind()移除所有段落上的所有绑定的事件。$("p").unbind("click")移除所有段落上的click事件。hover(over,out)over,out都是方法,当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。$("p").hover(function(){$(this).addClass("over");},function(){$(this).addClass("out");});toggle(fn,fn)如果点击了一个匹配的元素，则触发指定的第一个函数，当再次点击同一元素时，则触发指定的第二个函数。$("p").toggle(function(){$(this).addClass("selected");},function(){$(this).removeClass("selected");});元素事件列表说明注：不带参数的函数，其参数为可选的fn。jQuery不支持form元素的reset事件。事件描述支持元素或对象blur()元素失去焦点a,input,textarea,button,select,label,map,areachange()用户改变域的内容input,textarea,selectclick()鼠标点击某个对象 几乎所有元素dblclick()鼠标双击某个对象几乎所有元素error()当加载文档或图像时发生某个错误window,imgfocus()元素获得焦点a,input,textarea,button,select,label,map,areakeydown()某个键盘的键被按下几乎所有元素keypress()某个键盘的键被按下或按住几乎所有元素keyup()某个键盘的键被松开几乎所有元素load(fn)某个页面或图像被完成加载window,imgmousedown(fn)某个鼠标按键被按下几乎所有元素mousemove(fn)鼠标被移动几乎所有元素mouseout(fn)鼠标从某元素移开 几乎所有元素mouseover(fn)鼠标被移到某元素之上 几乎所有元素mouseup(fn)某个鼠标按键被松开几乎所有元素resize(fn)窗口或框架被调整尺寸window,iframe,framescroll(fn)滚动文档的可视部分时windowselect()文本被选定document,input,textareasubmit()提交按钮被点击formunload(fn)用户退出页面windowJQueryAjax方法说明load(url,[data],[callback])装入一个远程HTML内容到一个DOM结点。$("#feeds").load("feeds.html");将feeds.html文件载入到id为feeds的div中$("#feeds").load("feeds.php",{limit:25},function(){alert("Thelast25entriesinthefeedhavebeenloaded");});jQuery.get(url,[data],[callback])使用GET请求一个页面。$.get("test.cgi",{name:"John",time:"2pm"},function(data){alert("DataLoaded:"+data);});jQuery.getJSON(url,[data],[callback])使用GET请求JSON数据。$.getJSON("test.js",{name:"John",time:"2pm"},function(json){alert("JSONData:"+json.users[3].name);});jQuery.getScript(url,[callback])使用GET请求JavaScript文件并执行。$.getScript("test.js",function(){alert("Scriptloadedandexecuted.");});jQuery.post(url,[data],[callback],[type]) 使用POST请求一个页面。ajaxComplete(callback)当一个AJAX请求结束后，执行一个函数。这是一个Ajax事件$("#msg").ajaxComplete(function(request,settings){$(this).append("<li>RequestComplete.</li>");});ajaxError(callback) 当一个AJAX请求失败后，执行一个函数。这是一个Ajax事件$("#msg").ajaxError(function(request,settings){$(this).append("<li>Errorrequestingpage"+settings.url+"</li>");});ajaxSend(callback)在一个AJAX请求发送时，执行一个函数。这是一个Ajax事件$("#msg").ajaxSend(function(evt,request,settings){$(this).append("<li<Startingrequestat"+settings.url+"</li<");});ajaxStart(callback)在一个AJAX请求开始但还没有激活时，执行一个函数。这是一个Ajax事件。当AJAX请求开始(并还没有激活时)显示loading信息。$("#loading").ajaxStart(function(){$(this).show();});ajaxStop(callback)当所有的AJAX都停止时，执行一个函数。这是一个Ajax事件。当所有AJAX请求都停止时，隐藏loading信息。$("#loading").ajaxStop(function(){$(this).hide();});ajaxSuccess(callback)当一个AJAX请求成功完成后，执行一个函数。这是一个Ajax事件。当AJAX请求成功完成时，显示信息。$("#msg").ajaxSuccess(function(evt,request,settings){$(this).append("<li>SuccessfulRequest!</li>");});jQuery.ajaxSetup(options)为所有的AJAX请求进行全局设置。查看$.ajax函数取得所有选项信息。设置默认的全局AJAX请求选项。$.ajaxSetup({url:"/xmlhttp/",global:false,type:"POST"});$.ajax({data:myData});serialize()以名称和值的方式连接一组input元素。实现了正确表单元素序列。functionshowValues(){varstr=$("form").serialize();$("#results").text(str);}$(":checkbox,:radio").click(showValues);$("select").change(showValues);showValues();serializeArray()连接所有的表单和表单元素(类似于.serialize()方法)，但是返回一个JSON数据格式。从form中取得一组值，显示出来。functionshowValues(){varfields=$(":input").serializeArray();alert(fields);$("#results").empty();jQuery.each(fields,function(i,field){$("#results").append(field.value+"");});}$(":checkbox,:radio").click(showValues);$("select").change(showValues);showValues();JQueryEffects方法说明show()显示隐藏的匹配元素。show(speed,[callback])以优雅的动画显示所有匹配的元素，并在显示完成后可选地触发一个回调函数。hide()隐藏所有的匹配元素。hide(speed,[callback])以优雅的动画隐藏所有匹配的元素，并在显示完成后可选地触发一个回调函数。toggle()切换元素的可见状态。如果元素是可见的，切换为隐藏的；如果元素是隐藏的，切换为可见的。slideDown(speed,[callback])通过高度变化（向下增大）来动态地显示所有匹配的元素，在显示完成后可选地触发一个回调函数。这个动画效果只调整元素的高度，可以使匹配的元素以"滑动"的方式显示出来。slideUp(speed,[callback])通过高度变化（向上减小）来动态地隐藏所有匹配的元素，在隐藏完成后可选地触发一个回调函数。这个动画效果只调整元素的高度，可以使匹配的元素以"滑动"的方式隐藏起来。slideToggle(speed,[callback])通过高度变化来切换所有匹配元素的可见性，并在切换完成后可选地触发一个回调函数。这个动画效果只调整元素的高度，可以使匹配的元素以"滑动"的方式隐藏或显示。fadeIn(speed,[callback])通过不透明度的变化来实现所有匹配元素的淡入效果，并在动画完成后可选地触发一个回调函数。这个动画只调整元素的不透明度，也就是说所有匹配的元素的高度和宽度不会发生变化。fadeOut(speed,[callback])通过不透明度的变化来实现所有匹配元素的淡出效果，并在动画完成后可选地触发一个回调函数。这个动画只调整元素的不透明度，也就是说所有匹配的元素的高度和宽度不会发生变化。fadeTo(speed,opacity,[callback])把所有匹配元素的不透明度以渐进方式调整到指定的不透明度，并在动画完成后可选地触发一个回调函数。这个动画只调整元素的不透明度，也就是说所有匹配的元素的高度和宽度不会发生变化。stop()停止所有匹配元素当前正在运行的动画。如果有动画处于队列当中，他们就会立即开始。queue()取得第一个匹配元素的动画序列的引用(返回一个内容为函数的数组)。queue(callback)在每一个匹配元素的事件序列的末尾添加一个可执行函数，作为此元素的事件函数。queue(queue)以一个新的动画序列代替所有匹配元素的原动画序列。dequeue()执行并移除动画序列前端的动画。animate(params,[duration],[easing],[callback])用于创建自定义动画的函数。animate(params,options)创建自定义动画的另一个方法。作用同上。JQueryTraversing方法说明eq(index)从匹配的元素集合中取得一个指定位置的元素，index从0开始。filter(expr)返回与指定表达式匹配的元素集合，可以使用","号分割多个expr，用于实现多个条件筛选。filter(fn)利用一个特殊的函数来作为筛选条件移除集合中不匹配的元素。is(expr)用一个表达式来检查当前选择的元素集合，如果其中至少有一个元素符合这个给定的表达式就返回true。map(callback)将jQuery对象中的一组元素利用callback方法转换其值，然后添加到一个jQuery数组中。not(expr)从匹配的元素集合中删除与指定的表达式匹配的元素。slice(start,[end])从匹配元素集合中取得一个子集，和内建的数组的slice方法相同。add(expr)把与表达式匹配的元素添加到jQuery对象中。children([expr])取得一个包含匹配的元素集合中每一个元素的所有子元素的元素集合。可选的过滤器将使这个方法只匹配符合的元素(只包括元素节点，不包括文本节点)。contents()取得一个包含匹配的元素集合中每一个元素的所有子孙节点的集合(只包括元素节点，不包括文本节点)，如果元素为iframe，则取得其中的文档元素。find(expr)搜索所有与指定表达式匹配的元素。next([expr])取得一个包含匹配的元素集合中每一个元素紧邻的后面同辈元素的元素集合。nextAll([expr])取得一个包含匹配的元素集合中每一个元素所有的后面同辈元素的元素集合。parent([expr])取得一个包含着所有匹配元素的唯一父元素的元素集合。parents([expr])取得一个包含着所有匹配元素的唯一祖先元素的元素集合（不包含根元素）。prev([expr])取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。prevAll([expr])取得一个包含匹配的元素集合中每一个元素的之前所有同辈元素的元素集合。siblings([expr])取得一个包含匹配的元素集合中每一个元素的所有同辈元素的元素集合。andSelf()将前一个匹配的元素集合添加到当前的集合中。取得所有div元素和其中的p元素，添加border类属性。取得所有div元素中的p元素，添加background类属性：$("div").find("p").andSelf().addClass("border");$("div").find("p").addClass("background");end()结束当前的操作，回到当前操作的前一个操作，找到所有p元素其中的span元素集合，然后返回p元素集合，添加css属性：$("p").find("span").end().css("border","2pxredsolid");JQuerySelectors方法说明基本选择器$("#myDiv")匹配唯一的具有此id值的元素$("div")匹配指定名称的所有元素$(".myClass")匹配具有此class样式值的所有元素$("*")匹配所有元素$("div,span,p.myClass")联合所有匹配的选择器层叠选择器$("forminput")后代选择器，选择ancestor的所有子孙节点$("#main>*")子选择器，选择parent的所有子节点$("label+input")临选择器，选择prev的下一个临节点$("#prev~div")同胞选择器，选择prev的所有同胞节点基本过滤选择器$("tr:first")匹配第一个选择的元素$("tr:last")匹配最后一个选择的元素$("input:not(:checked)+span")从原元素集合中过滤掉匹配selector的所有元素（这里有是一个临选择器）$("tr:even")匹配集合中偶数位置的所有元素(从0开始)$("tr:odd")匹配集合中奇数位置的所有元素(从0开始)$("td:eq(2)")匹配集合中指定位置的元素(从0开始)$("td:gt(4)")匹配集合中指定位置之后的所有元素(从0开始)$("td:gl(4)")匹配集合中指定位置之前的所有元素(从0开始)$(":header")匹配所有标题$("div:animated")匹配所有正在运行动画的所有元素内容过滤选择器$("div:contains('John')")匹配含有指定文本的所有元素$("td:empty")匹配所有空元素(只含有文本的元素不算空元素)$("div:has(p)")从原元素集合中再次匹配所有至少含有一个selector的所有元素$("td:parent")匹配所有不为空的元素(含有文本的元素也算)$("div:hidden")匹配所有隐藏的元素，也包括表单的隐藏域$("div:visible")匹配所有可见的元素属性过滤选择器$("div[id]")匹配所有具有指定属性的元素$("input[name='newsletter']")匹配所有具有指定属性值的元素$("input[name!='newsletter']")匹配所有不具有指定属性值的元素$("input[name^='news']")匹配所有指定属性值以value开头的元素$("input[name$='letter']")匹配所有指定属性值以value结尾的元素$("input[name*='man']")匹配所有指定属性值含有value字符的元素$("input[id][name$='man']")匹配同时符合多个选择器的所有元素子元素过滤选择器$("ulli:nth-child(2)"),$("ulli:nth-child(odd)"),匹配父元素的第n个子元素$("ulli:nth-child(3n+1)")$("divspan:first-child")匹配父元素的第1个子元素$("divspan:last-child")匹配父元素的最后1个子元素$("divbutton:only-child")匹配父元素的唯一1个子元素表单元素选择器$(":input")匹配所有的表单输入元素，包括所有类型的input,textarea,select和button$(":text")匹配所有类型为text的input元素$(":password")匹配所有类型为password的input元素$(":radio")匹配所有类型为radio的input元素$(":checkbox")匹配所有类型为checkbox的input元素$(":submit")匹配所有类型为submit的input元素$(":image")匹配所有类型为image的input元素$(":reset")匹配所有类型为reset的input元素$(":button")匹配所有类型为button的input元素$(":file")匹配所有类型为file的input元素$(":hidden")匹配所有类型为hidden的input元素或表单的隐藏域表单元素过滤选择器$(":enabled")匹配所有可操作的表单元素$(":disabled")匹配所有不可操作的表单元素$(":checked")匹配所有已点选的元素$("selectoption:selected")匹配所有已选择的元素JQueryCSS方法说明css(name)访问第一个匹配元素的样式属性。css(properties)把一个"名/值对"对象设置为所有匹配元素的样式属性。$("p").hover(function(){$(this).css({backgroundColor:"yellow",fontWeight:"bolder"});},function(){varcssObj={backgroundColor:"#ddd",fontWeight:"",color:"rgb(0,40,244)"}$(this).css(cssObj);});css(name,value) 在所有匹配的元素中，设置一个样式属性的值。offset()取得匹配的第一个元素相对于当前可视窗口的位置。返回的对象有2个属性，top和left，属性值为整数。这个函数只能用于可见元素。varp=$("p:last");varoffset=p.offset();p.html("left:"+offset.left+",top:"+offset.top);width()取得当前第一匹配的元素的宽度值，width(val)为每个匹配的元素设置指定的宽度值。height()取得当前第一匹配的元素的高度值，height(val)为每个匹配的元素设置指定的高度值。JQueryUtilities方法说明jQuery.browser.msie表示iejQuery.browser.version读取用户浏览器的版本信息jQuery.boxModel检测用户浏览器针对当前页的显示是否基于W3CCSS的盒模型jQuery.isFunction(obj)检测传递的参数是否为functionfunctionstub(){}varobjs=[function(){},{x:15,y:20},null,stub,"function"];jQuery.each(objs,function(i){varisFunc=jQuery.isFunction(objs[i]);$("span:eq("+i+")").text(isFunc);});jQuery.trim(str) 清除字符串两端的空格，使用正则表达式来清除给定字符两端的空格jQuery.each(object,callback)一个通用的迭代器，可以用来无缝迭代对象和数组jQuery.extend(target,object1,[objectN])扩展一个对象，修改原来的对象并返回，这是一个强大的实现继承的工具，这种继承是采用传值的方法来实现的，而不是JavaScript中的原型链方式。合并settings和options对象，返回修改后的settings对象varsettings={validate:false,limit:5,name:"foo"};varoptions={validate:true,name:"bar"};jQuery.extend(settings,options);合并defaults和options对象，defaults对象并没有被修改。options对象中的值代替了defaults对象的值传递给了empty。varempty={}vardefaults={validate:false,limit:5,name:"foo"};varoptions={validate:true,name:"bar"};varsettings=$.extend(empty,defaults,options);jQuery.grep(array,callback,[invert])通过一个筛选函数来去除数组中的项$.grep([0,1,2],function(n,i){returnn>0;});jQuery.makeArray(obj)将一个类似数组的对象转化为一个真正的数组将选取的div元素集合转化为一个数组vararr=jQuery.makeArray(document.getElementsByTagName_r("div"));arr.reverse();//useanArraymethodonlistofdomelements$(arr).appendTo(document.body);jQuery.map(array,callback)使用某个方法修改一个数组中的项，然后返回一个新的数组jQuery.inArray(value,array)返回value在数组中的位置，如果没有找到，则返回-1jQuery.unique(array)删除数组中的所有重复元素，返回整理后的数组
下面介绍一个用jQuery实现JS中的定时器方法,在jQuery中的jQueryTimers插件中已封装JS的setTimeout和setInterval方法.在jQueryTimers中提供了3个函数式everyTime(时间间隔,[计时器名称],函式名称,[次数限制],[等待函式程序完成])oneTime(时间间隔,[计时器名称],呼叫的函式)stopTime([计时器名称],[函式名称])everyTime函数式everyTime函数式相当于js中的循环定时器1:每间隔一秒钟循环执行a()functiona(){alert(1);}$('body').everyTime('1s',a);2:简写版$('body').everyTime('1s',function(){alert(1);});3:每隔一秒执行,并给计时器命名为A$('body').everyTime('1s','A',function(){alert(1);});4:每隔二十秒执行,最多5次,并给计时器命名为A$('body').everyTime('20s','A',function(){alert(1);},5);oneTime函数式1:10s后执行函数$('body').oneTime('1das',function(){alert(1);});2:100s后执行函数,并给计时器命名为A$('body').oneTime('100s','A',function(){alert(1);});stopTime函数式1:停止所有的在$('body')上计时器$('body').stopTime();2:停止$('body')上名称为A的计时器$('body').stopTime('A');3:停止$('body')上所有呼叫a()的计时器$('body').stopTime(a);使用方式jQueryTimers插件及引用代码<scriptth:src="/js/jquery-3.3.1.min.js"></script><scriptth:src="/js/jquery.timers-1.2.js"></script>
1、利用http的重定向来跳转window.location.replace("http://www.zhansanjie.com");注意该方式是直接替换当前页面url为后者，如果后页面中有history.back()，则无法成功返回2、使用href来跳转window.location.href="http://www.zhansanjie.com";3、使用jQuery的属性替换方法来实现跳转$(location).attr('href','http://www.zhansanjie.com');$(window).attr('location','http://www.zhansanjie.com');$(location).prop('href','http://www.zhansanjie.com')
注意：索引从0开始1.indexOf：查找子串在母串的第一次出现的索引值例如（qcby）在str=dfgfskqcbydfd；varstr="dfgfskqcbydfd"varindex=str.indexOf("qcby")console.log(index)//返回值为6（从0开始数）2.lastIndexOf：（倒着查找）查找子串在母串的第一次出现的索引值varstr="dfgfskqcbydfd";vara=str.lastIndexOf("qcby")//倒着数console.log(a);//输出6（末尾开始从0数qcby中的q的索引为6）3.substring：字符串裁剪（只支持正数，以及只支持正序截取）substring(4,8)（开始，结尾），括号里面的值只能是正数，如果substring(8,4)则默认从小到大截取varstr="0001"vara=str.slice(0,-1)//都是截取可以负数倒着截取末尾的索引为0，倒数第一个索引为-1console.log("a:"+a);//输出000（把末尾的一位：1删掉了）4.slice：及支持整数截取右支持负截取相同：都是字符串截取区别：slice(起始,结束)支持负数，负数则表示倒着截取，slice(0,-1)（起始位，结尾位）。注意：如果slice中含有负数时，例：倒着截掉一位varstr="abcdef"vara=str.slice(0,-1)//都是截取可以负数倒着截取末尾的索引为0，倒数第一个索引为-1console.log("a:"+a);//输出abcde（把末尾的一位：f删掉了）
//设置选中项functionsetSelected(value){if(value){$("select").children("option").each(function(){vartemp_value=$(this).val();$(this).removeAttr("selected");if(temp_value===value){$(this).attr("selected","selected");}});}}
今天又是关于前端浏览器兼容的问题，原代码：data.data.forEach((item,index,arr)=>{ArticleHtml+="<liclass='am-gam-list-item-dated'><ahref='javascript:;'οnclick='GetArticleContent(\""+item.Id+"\");'class='am-list-item-hd'>"+item.ArticleName+"</a><spanclass='am-list-date'>"+item.CreateTime.substr(0,10)+"</span></li>";});新代码$.each(data.data,function(i,item){ArticleHtml+="<liclass='am-gam-list-item-dated'><ahref='javascript:;'οnclick='GetArticleContent(\""+item.Id+"\");'class='am-list-item-hd'>"+item.ArticleName+"</a><spanclass='am-list-date'>"+item.CreateTime.substr(0,10)+"</span></li>";});两种代码在谷歌，火狐，360浏览器上都没有问题，到了IE浏览器问题就又出现了，IE浏览器直接在原代码的=>处报了错误，小编也不知道为什么，于是又查了一些关于each循环的语句参考，做的新代码运行成功！参考博客地址Jquery的foreach.each方法详解以后别化妆了，浪费时间，你怎么看都是我喜欢的类型。“你跑的快吗?”“很快啊!”“那我追的到你吗?”“记住你的身份”“什么身份”“你是我的人”我上一次见到像你这么美的女孩，还是我昨天见你的时候。我说：“你是猪。”你说：“我是猪才怪!”从此我就叫你猪才怪。终于有一天，你忍不住当着众人的面对我吼道：“我不是猪才怪!”
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><metaname="description"content=""><metaname="keywords"content=""><title>简单利用jquery.cookie插件使弹窗点击关闭后一天弹一次</title><styletype="text/css">*{margin:0;padding:0;}.alert_windows{display:none;position:absolute;z-index:10;width:400px;height:300px;background:#566F93;}.alert_windowsspan{float:right;width:30px;height:30px;text-align:center;font:15px/30pxMicrosoftYahei;cursor:pointer;color:#333;background:lightblue;}.alert_windowsspan:hover{color:#EEE;background:red;}</style><scripttype="text/javascript"src="js/jquery.min.js"></script><scripttype="text/javascript"src="js/jquery.cookie.js"></script></head><body><divstyle="font-size:24px;width:360px;margin:40pxauto;">提示：一天弹一次，关闭了就没了</div><divclass="alert_windows"><span>X</span></div></body></html><scripttype="text/javascript">$(function(){if($.cookie("isClose")!='yes'){varwinWid=$(window).width()/2-$('.alert_windows').width()/2;varwinHig=$(window).height()/2-$('.alert_windows').height()/2;$(".alert_windows").css({"left":winWid,"top":-winHig*2});//自上而下$(".alert_windows").show();$(".alert_windows").animate({"left":winWid,"top":winHig},1000);$(".alert_windowsspan").click(function(){$(this).parent().fadeOut(500);$.cookie("isClose",'yes',{expires:1/8640});//测试十秒//$.cookie("isClose",'yes',{expires:1});一天});}});</script>jquery.cookie.js是需要加载的，也可以直接复制到script代码中，主要用于保存时间至本地化，完成弹窗关闭后，一天只弹一次。/*jquery.cookiestart*/jQuery.cookie=function(name,value,options){if(typeofvalue!='undefined'){options=options||{};if(value===null){value='';options=$.extend({},options);options.expires=-1;}varexpires='';if(options.expires&&(typeofoptions.expires=='number'||options.expires.toUTCString)){vardate;if(typeofoptions.expires=='number'){date=newDate();date.setTime(date.getTime()+(options.expires*24*60*60*1000));//这里改时间，单位毫秒，默认为1天。}else{date=options.expires;}expires=';expires='+date.toUTCString();}varpath=options.path?';path='+(options.path):'';vardomain=options.domain?';domain='+(options.domain):'';varsecure=options.secure?';secure':'';document.cookie=[name,'=',encodeURIComponent(value),expires,path,domain,secure].join('');}else{varcookieValue=null;if(document.cookie&&document.cookie!=''){varcookies=document.cookie.split(';');for(vari=0;i<cookies.length;i++){varcookie=jQuery.trim(cookies[i]);if(cookie.substring(0,name.length+1)==(name+'=')){cookieValue=decodeURIComponent(cookie.substring(name.length+1));break;}}}returncookieValue;}};/*jquery.cookieend*/
1.预加载图片(function($){varcache=[];//Argumentsareimagepathsrelativetothecurrentpage.$.preLoadImages=function(){varargs_len=arguments.length;for(vari=args_len;i--;){varcacheImage=document.createElement('img');cacheImage.src=arguments[i];cache.push(cacheImage);}}jQuery.preLoadImages("image1.gif","/path/to/image2.png");2.让页面中的每个元素都适合在移动设备上展示varscr=document.createElement('script');scr.setAttribute('src','https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js');document.body.appendChild(scr);scr.onload=function(){$('div').attr('class','').attr('id','').css({'margin':0,'padding':0,'width':'100%','clear':'both'});};3.图像等比例缩放$(window).bind("load",function(){//IMAGERESIZE$('#product_cat_listimg').each(function(){varmaxWidth=120;varmaxHeight=120;varratio=0;varwidth=$(this).width();varheight=$(this).height();if(width>maxWidth){ratio=maxWidth/width;$(this).css("width",maxWidth);$(this).css("height",height*ratio);height=height*ratio;}varwidth=$(this).width();varheight=$(this).height();if(height>maxHeight){ratio=maxHeight/height;$(this).css("height",maxHeight);$(this).css("width",width*ratio);width=width*ratio;}});4.返回页面顶部$(document).ready(function(){$('.top').click(function(){$(document).scrollTo(0,500);});});//Createalinkdefinedwiththeclass.top<ahref="#"class="top">BackToTop</a>5.使用jQuery打造手风琴式的折叠效果varaccordion={init:function(){var$container=$('#accordion');$container.find('li:not(:first).details').hide();$container.find('li:first').addClass('active');$container.on('click','lia',function(e){e.preventDefault();var$this=$(this).parents('li');if($this.hasClass('active')){if($('.details').is(':visible')){$this.find('.details').slideUp();}else{$this.find('.details').slideDown();}}else{$container.find('li.active.details').slideUp();$container.find('li').removeClass('active');$this.addClass('active');$this.find('.details').slideDown();}});}};6.通过预加载图片廊中的上一幅下一幅图片来模仿Facebook的图片展示方式varnextimage="/images/some-image.jpg";$(document).ready(function(){window.setTimeout(function(){varimg=$("").attr("src",nextimage).load(function(){//alldone});},100);});7.使用jQuery和Ajax自动填充选择框$(function(){$("select#ctlJob").change(function(){$.getJSON("/select.php",{id:$(this).val(),ajax:'true'},function(j){varoptions='';for(vari=0;i<j.length;i++){options+=''+j[i].optionDisplay+'';}$("select#ctlPerson").html(options);})})})8.自动替换丢失的图片//SafeSnippet$("img").error(function(){$(this).unbind("error").attr("src","missing_image.gif");});//PersistentSnipper$("img").error(function(){$(this).attr("src","missing_image.gif");});源码9.在鼠标悬停时显示淡入/淡出特效$(document).ready(function(){$(".thumbsimg").fadeTo("slow",0.6);//Thissetstheopacityofthethumbstofadedownto60%whenthepageloads$(".thumbsimg").hover(function(){$(this).fadeTo("slow",1.0);//Thisshouldsettheopacityto100%onhover},function(){$(this).fadeTo("slow",0.6);//Thisshouldsettheopacitybackto60%onmouseout});});10.清空表单数据functionclearForm(form){//iterateoveralloftheinputsfortheform//elementthatwaspassedin$(':input',form).each(function(){vartype=this.type;vartag=this.tagName.toLowerCase();//normalizecase//it'soktoresetthevalueattroftextinputs,//passwordinputs,andtextareasif(type=='text'||type=='password'||tag=='textarea')this.value="";//checkboxesandradiosneedtohavetheircheckedstatecleared//butshould*not*havetheir'value'changedelseif(type=='checkbox'||type=='radio')this.checked=false;//selectelementsneedtohavetheir'selectedIndex'propertysetto-1//(thisworksforbothsingleandmultipleselectelements)elseif(tag=='select')this.selectedIndex=-1;});};11.预防对表单进行多次提交$(document).ready(function(){$('form').submit(function(){if(typeofjQuery.data(this,"disabledOnSubmit")=='undefined'){jQuery.data(this,"disabledOnSubmit",{submited:true});$('input[type=submit],input[type=button]',this).each(function(){$(this).attr("disabled","disabled");});returntrue;}else{returnfalse;}});});12.动态添加表单元素//changeeventonpassword1fieldtopromptnewinput$('#password1').change(function(){//dynamicallycreatenewinputandinsertafterpassword1$("#password1").append("");});13.让整个Div可点击blahblahblah.linkThefollowinglinesofjQuerywillmaketheentiredivclickable:$(".myBox").click(function(){window.location=$(this).find("a").attr("href");returnfalse;});14.平衡高度或Div元素varmaxHeight=0;$("div").each(function(){if($(this).height()>maxHeight){maxHeight=$(this).height();}});$("div").height(maxHeight);15.在窗口滚动时自动加载内容varloading=false;$(window).scroll(function(){if((($(window).scrollTop()+$(window).height())+250)>=$(document).height()){if(loading==false){loading=true;$('#loadingbar').css("display","block");$.get("load.php?start="+$('#loaded_max').val(),function(loaded){$('body').append(loaded);$('#loaded_max').val(parseInt($('#loaded_max').val())+50);$('#loadingbar').css("display","none");loading=false;});}}});$(document).ready(function(){$('#loaded_max').val(50);});
中国互联网举报中心