jquery文档处理有哪些？jquery考试题及答案

编程之家2026-06-30683次浏览

各位老铁们，大家好，今天由我来为大家分享jquery文档处理有哪些，以及jquery考试题及答案的相关问题知识，希望对大家有所帮助。如果可以帮助到大家，还望关注收藏下本站，您的支持是我们最大的动力，谢谢大家了哈，下面我们开始吧！

jquery文档操作都有哪些函数

jQuery中为我们提供了很多有用的方法和属性，自己总结的一些常用的函数，方法。个人认为在在线排盘开发中会比较常用的，仅供大家学习和参考。

事件处理

ready(fn)

代码：

$(document).ready(function(){

// Your code here...

});

作用：它可以极大地提高web应用程序的响应速度。通过使用这个方法，可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数，而99.99%的JavaScript函数都需要在那一刻执行。

bind(type,[data],fn)

代码：

$("p").bind("click", function(){

alert($(this).text());

});

作用：为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数。起到事件监听的作用。

toggle(fn,fn)代码：

$("td").toggle(

function(){

$(this).addClass("selected");

function(){

$(this).removeClass("selected");

}

);

作用：每次点击时切换要调用的函数。如果点击了一个匹配的元素，则触发指定的第一个函数，当再次点击同一元素时，则触发指定的第二个函数。挺有趣的一个函数，在动态实现某些功能的时候可能会用到。

(像click(),focus(),keydown()这样的事件这里就不提了，那些都是开发中比较常用到的。)

外观效果

addClass(class)和removeClass(class)

代码：

$(".stripe tr").mouseover(function(){

$(this).addClass("over");}).mouseout(function(){

$(this).removeClass("over");})

});

也可以写成：

$(".stripe tr").mouseover(function(){$(this).addClass("over")});

$(".stripe tr").mouseout(function(){$(this).removeClass("over")});

作用：为指定的元素添加或移除样式，从而实现动态的样式效果，上面的实例中实现鼠标移动双色表格的代码。

css(name,value)

代码：$("p").css("color","red");

作用：很简单，就是在匹配的元素中，设置一个样式属性的值。这个个人感觉和上面的addClass(class)有点类似。

slide(),hide(),fadeIn(), fadeout(), slideUp(),slideDown()

代码：

$("#btnShow").bind("click",function(event){$("#divMsg").show()});

$("#btnHide").bind("click",function(evnet){$("#divMsg").hide()});

作用：jQuery中提供的比较常用的几个动态效果的函数。还可以添加参数：show(speed,[callback])以优雅的动画显示所有匹配的元素，并在显示完成后可选地触发一个回调函数。

animate(params[,duration[,easing[,callback]]])

作用：制作动画效果用到的函数，功能非常的强大，可以连续使用此函数。

查找筛选

map(callback)HTML代码:

Values:

return$(this).val();

}).get().join(","));

结果:

[

John, password, ; ]

作用：将一组元素转换成其他数组(不论是否是元素数组)你可以用这个函数来建立一个列表，不论是值、属性还是CSS样式，或者其他特别形式。这都可以用'$.map()'来方便的建立。

find(expr)

HTML代码:

Hello, how are you?

jQuery代码:

$("p").find("span")

结果:

[ Hello ]

作用：搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法。

文档处理

attr(key,value)HTML代码:

jQuery代码:

$("img").attr("src","test.jpg");

作用：取得或设置匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性，则返回 undefined。在控制HTML标记上是必备的工具。

html()/html(val)HTML代码:

Hello

jQuery代码:

$("div").html();

结果:

Hello

作用：取得或设置匹配元素的html内容，同类型的方法还有text()和val()。前者是取得所有匹配元素的内容。，后者是获得匹配元素的当前值。三者有相似的地方常用在内容的操作上。

wrap(html)HTML代码:

Test Paragraph.

jQuery代码:

$("p").wrap("

");

结果:

Test Paragraph.

作用：把所有匹配的元素用其他元素的结构化标记包裹起来。

这种包装对于在文档中插入额外的结构化标记最有用，而且它不会破坏原始文档的语义品质。可以灵活的修改我们的DOM。

empty()HTML代码:

Hello, Person

jQuery代码:

$("p").empty();

结果:

作用：删除匹配的元素集合中所有的子节点。

Ajax处理

load(url,[data],[callback])

url(String):待装入 HTML网页网址。

data(Map):(可选)发送至服务器的 key/value数据。

callback(Callback):(可选)载入成功时回调函数。

代码：

$("#feeds").load("feeds.aspx",{limit: 25}, function(){

alert("The last 25 entries in the feed have been loaded");

});

作用：载入远程 HTML文件代码并插入至 DOM中。这也是Jquery操作Ajax最常用最有效的方法。

serialize()HTML代码:

Results:

check1

checked="checked"/> check2

checked="checked"/> radio1

radio2

jQuery代码:

$("#results").append(""+$("form").serialize()+"");

作用：序列化表格内容为字符串。用于 Ajax请求。

工具

jQuery.each(obj,callback)

代码：

$.each( [0,1,2], function(i, n){

alert("Item#"+ i+":"+ n);

});//遍历数组

$.each({ name:"John", lang:"JS"}, function(i, n){

alert("Name:"+ i+", Value:"+ n);//遍历对象

});

作用：通用例遍方法，可用于例遍对象和数组。

jQuery.makeArray(obj)

HTML代码:

First

Second

Third

Fourth

jQuery代码:

var arr= jQuery.makeArray(document.getElementsByTagName("div"));

结果:

Fourth

Third

Second

First

作用：将类数组对象转换为数组对象。使我们可以在数组和对象之间灵活的转换。

jQuery.trim(str)

作用：这个大家应该很熟悉，就是去掉字符串起始和结尾的空格。

小结：在实际的开发中我们可能会发现21世纪开运网用到其他的方法和属性，以上只是个人认为新手初学jQuery时，必须掌握的一些方法。仅供大家学习的参考。

以上内容就是我们为大家提供的jQuery中常用的函数方法，希望可以帮助到大家。

jquery中有哪些事件处理程序

bind()向元素添加事件处理程序

blur()添加/触发 blur事件

change()添加/触发 change事件

click()添加/触发 click事件

dblclick()添加/触发 double click事件

delegate()向匹配元素的当前或未来的子元素添加处理程序

die()在版本 1.9中被移除。移除所有通过 live()方法添加的事件处理程序

error()在版本 1.8中被废弃。添加/触发 error事件

event.currentTarget在事件冒泡阶段内的当前 DOM元素

event.data包含当前执行的处理程序被绑定时传递到事件方法的可选数据

event.delegateTarget返回当前调用的 jQuery事件处理程序所添加的元素

event.isDefaultPrevented()返回指定的 event对象上是否调用了 event.preventDefault()

event.isImmediatePropagationStopped()返回指定的 event对象上是否调用了 event.stopImmediatePropagation()

event.isPropagationStopped()返回指定的 event对象上是否调用了 event.stopPropagation()

event.namespace返回当事件被触发时指定的命名空间

event.pageX返回相对于文档左边缘的鼠标位置

event.pageY返回相对于文档上边缘的鼠标位置

event.preventDefault()阻止事件的默认行为

event.relatedTarget返回当鼠标移动时哪个元素进入或退出

event.result包含由被指定事件触发的事件处理程序返回的最后一个值

event.stopImmediatePropagation()阻止其他事件处理程序被调用

event.stopPropagation()阻止事件向上冒泡到 DOM树，阻止任何父处理程序被事件通知

event.target返回哪个 DOM元素触发事件

event.timeStamp返回从 1970年 1月 1日到事件被触发时的毫秒数

event.type返回哪种事件类型被触发

event.which返回指定事件上哪个键盘键或鼠标按钮被按下

event.metaKey事件触发时 META键是否被按下

focus()添加/触发 focus事件

focusin()添加事件处理程序到 focusin事件

focusout()添加事件处理程序到 focusout事件

hover()添加两个事件处理程序到 hover事件

keydown()添加/触发 keydown事件

keypress()添加/触发 keypress事件

keyup()添加/触发 keyup事件

live()在版本 1.9中被移除。添加一个或多个事件处理程序到当前或未来的被选元素

load()在版本 1.8中被废弃。添加一个事件处理程序到 load事件

mousedown()添加/触发 mousedown事件

mouseenter()添加/触发 mouseenter事件

mouseleave()添加/触发 mouseleave事件

mousemove()添加/触发 mousemove事件

mouseout()添加/触发 mouseout事件

mouseover()添加/触发 mouseover事件

mouseup()添加/触发 mouseup事件

off()移除通过 on()方法添加的事件处理程序

on()向元素添加事件处理程序

one()向被选元素添加一个或多个事件处理程序。该处理程序只能被每个元素触发一次

$.proxy()接受一个已有的函数，并返回一个带特定上下文的新的函数

ready()规定当 DOM完全加载时要执行的函数

resize()添加/触发 resize事件

scroll()添加/触发 scroll事件

select()添加/触发 select事件

submit()添加/触发 submit事件

toggle()在版本 1.9中被移除。添加 click事件之间要切换的两个或多个函数

trigger()触发绑定到被选元素的所有事件

triggerHandler()触发绑定到被选元素的指定事件上的所有函数

unbind()从被选元素上移除添加的事件处理程序

undelegate()从现在或未来的被选元素上移除事件处理程序

unload()在版本 1.8中被废弃。添加事件处理程序到 unload事件

contextmenu()添加事件处理程序到 contextmenu事件

$.holdReady()用于暂停或恢复.ready()事件的执行

JqueryAjax请求文件下载操作失败怎么处理

这次给大家带来Jquery Ajax请求文件下载操作失败怎么处理，处理Jquery Ajax请求文件下载操作失败的注意事项有哪些，下面就是实战案例，一起来看一下。

jQuery确实是一个挺好的轻量级的JS框架，能帮助我们快速的开发JS应用，并在一定程度上改变了我们写JavaScript代码的习惯，本文重点给大家介绍Jquery Ajax请求文件下载操作失败的原因分析及解决办法，对ajax请求失败的原因分析感兴趣的朋友一起学习把

jQuery确实是一个挺好的轻量级的JS框架，能帮助我们快速的开发JS应用，并在一定程度上改变了我们写JavaScript代码的习惯。

废话少说，直接进入正题，我们先来分析一下失败的原因

一、失败的原因

那是因为response原因，一般请求浏览器是会处理服务器输出的response，例如生成png、文件下载等,然而ajax请求只是个“字符型”的请求，即请求的内容是以文本类型存放的。文件的下载是以二进制形式进行的，虽然可以读取到返回的response，但只是读取而已，是无法执行的，说白点就是js无法调用到浏览器的下载处理机制和程序。

二、解决方案

1）可以使用jquery创建表单并提交实现文件下载；

var form=$("<form>");

form.attr("style","display:none");

form.attr("target","");

form.attr("method","post");

form.attr("action",rootPath+"T_academic_essay/DownloadZipFile.do");

var input1=$("<input>");

input1.attr("type","hidden");

input1.attr("name","strZipPath");

input1.attr("value",strZipPath);

$("body").append(form);

form.append(input1);

form.submit();

form.remove();2）可以直接使用a标签实现文件下载；

3）使用隐藏iframe或新窗体解决。

PS：AJAX请求$.ajax方法的使用

使用jQuery的$.ajax方法可以更为详细的控制AJAX请求。它在AJAX请求上施加细粒度级别的控制。

$.ajax方法语法

$.ajax(options)

参数

options

(对象)一个对象的实例，其属性定义这个操作的参数。详情见下表。

返回值

XHR实例

options详细范围值

名称

类型

描述

url

字符串

请求的url地址

type

字符串

将要使用的HTTP方法。通常是POST或GET。如果省略，则默认为GET

data

对象

一个对象，其属性作为查询参数而传递请求。如果是GET请求，则把数据作为查询字符串传递；如果是POST请求，则把数据作为请求体传递。在这两种情况下，都是由$.ajax()实用工具函数来处理值的编码

dataType

字符串

一个关键字，用来标识预期将被响应所返回的数据的类型。这个值决定再把数据传递给回调函数之前(如果有)进行什么后续处理。有效值如下：

xml-响应文本被解析为XML文档，而作为结果的XML DOM被传递给回调函数

html-响应文本未经处理就被传递给回调函数。在已返回HTML片段内的任何<script>块将被求值

json-响应文本被求值为JSON字符串，而作为结果的对象被传递给回调函数

jsonp-与json相似，不同之处是提供远程脚本支持(假定远程服务器支持)

script-响应文本被传递给回调函数。在任何回调函数被调用之前，响应被作为一个或多个JavaScript语句而进行处理

text-响应文本被假定为普通文本。服务器资源负责设置适当的内容类型响应标头。如果省略这个属性，则不对响应文本进行任何处理或求值就传递给回调函数

timeout

数值

设置Ajax请求的超时值(毫秒)。如果请求在超时值到期之前仍未完成，则中止请求并且调用错误回调函数(如果已定义)

global

布尔型

启用或禁用全局函数的触发。这些函数可以附加到元素上，并且在Ajax调用的不同时刻或状态下触发。默认启用全局函数触发

contentType

字符串

将要在请求上指定的内容类型。默认为application/x-www-form-urlencoded(与表单提交所使用的默认类型相同)

success

函数

如果请求的响应指示成功状态码，则这个函数被调用。响应体作为第一个参数被返回给这个函数，并且根据指定的dataType属性进行。第二个参数是包含状态码的字符串—这种情况下永远为成功状态码

error

函数

如果请求的响应返回错误状态码，则这个函数被调用。三个实参被传递给这个函数：XHR实例、状态消息字符串(在这种情况下永远为错误状态码)以及XHR实例所返回的异常对象(可选)

complete

函数

请求完成时被调用。两个实参被传递：XHR实例和状态消息字符串(成功状态码或错误状态码)。如果也指定了success或error回调函数，则这个函数在success或error回调函数调用之后被调用

beforeSend

函数

在发起请求之前被调用。这个函数被传递XHR实例，并且可以用来设置自定义的标头或执行其他预请求操作

async

布尔型

如果指定为false，则请求被提交为同步请求。在默认的情况下，请求是异步的

processData

布尔型

如果设置为false，则阻止已传递数据被加工为URL编码格式。默认情况下，数据被加工为URL编码格式(适用于类型为application/x-www-form-urlencoded的请求)

ifModified

布尔型

如果设置为true，则自从上一次请求以来，只有在响应内容没有改变的情况下(根据Last-Modified标头)才允许请求成功。如果省略，则不执行标头检查

下面看个例子，尽可能多的用到options中的选项

客户端代码：

<head>

$().ready(function(){

$('#selectNum').change(function(){

var idValue=$(this).val();

var show=$('#show');

$.ajax({

url:'Server.aspx',

type:'POST',

data:{ id: idValue},

//调小超时时间会引起异常

timeout: 3000,

//请求成功后触发

success: function(data){ show.append('success invoke!'+ data+'<br/>');},

//请求失败遇到异常触发

error: function(xhr, errorInfo, ex){ show.append('error invoke!errorInfo:'+ errorInfo+'<br/>');},

//完成请求后触发。即在success或error触发后触发

complete: function(xhr, status){ show.append('complete invoke! status:'+ status+'<br/>');},

//发送请求前触发

beforeSend: function(xhr){

//可以设置自定义标头

xhr.setRequestHeader('Content-Type','application/xml;charset=utf-8');

show.append('beforeSend invoke!'+'<br/>');

//是否使用异步发送

async: true

})

});

})

</script>

</head>

<body>

<option value="0">--Select--</option>

</select>

</body>

</html>服务端主要代码：

protected void Page_Load(object sender, EventArgs e)

{

if(!Page.IsPostBack)

{

if(Request["id"]!= null&&!string.IsNullOrEmpty(Request["id"].ToString()))

{

//启用该句会引发ajax超时异常

// System.Threading.Thread.Sleep(3000);

Response.Write(GetData(Request["id"].ToString()));

}

protected string GetData(string id)

{

string str= string.Empty;

switch(id)

{

case"1":

str+="This is Number 1";

break;

case"2":

str+="This is Number 2";

break;

case"3":

str+="This is Number 3";

break;

default:

str+="Warning Other Number!";

break;

}

return str;

}运行程序，结果如图：

相信看了本文案例你已经掌握了方法，更多精彩请关注Gxl网其它相关文章！