学习笔记(jQuery)

一时失言乱红尘 2022-08-06 04:12 284阅读 0赞

jQuery 事件

下面是 jQuery 中事件方法的一些例子:




























Event 函数

绑定函数至

$(document).ready(function)

将函数绑定到文档的就绪事件(当文档完成加载时)

$(selector).click(function)

触发或将函数绑定到被选元素的点击事件

$(selector).dblclick(function)

触发或将函数绑定到被选元素的双击事件

$(selector).focus(function)

触发或将函数绑定到被选元素的获得焦点事件

$(selector).mouseover(function)

触发或将函数绑定到被选元素的鼠标悬停事件



jQuery 效果 - 来自本页
















































函数

描述

$(selector).hide()

隐藏被选元素

$(selector).show()

显示被选元素

$(selector).toggle()

切换(在隐藏与显示之间)被选元素

$(selector).slideDown()

向下滑动(显示)被选元素

$(selector).slideUp()

向上滑动(隐藏)被选元素

$(selector).slideToggle()

对被选元素切换向上滑动和向下滑动

$(selector).fadeIn()

淡入被选元素

$(selector).fadeOut()

淡出被选元素

$(selector).fadeTo()

把被选元素淡出为给定的不透明度

$(selector).animate()

对被选元素执行自定义动画

jQuery HTML 操作 - 来自本页




























函数

描述

$(selector).html(content)

改变被选元素的(内部)HTML

$(selector).append(content)

向被选元素的(内部)HTML 追加内容

$(selector).prepend(content)

向被选元素的(内部)HTML “预置”(Prepend)内容

$(selector).after(content)

在被选元素之后添加 HTML

$(selector).before(content)

在被选元素之前添加 HTML

jQuery CSS 函数 - 来自本页




























CSS 属性

描述

$(selector).css(name,value)

为匹配元素设置样式属性的值

$(selector).css({properties})

为匹配元素设置多个样式属性

$(selector).css(name)

获得第一个匹配元素的样式属性值

$(selector).height(value)

设置匹配元素的高度

$(selector).width(value)

设置匹配元素的宽度

jQuery AJAX 请求
































请求

描述

$(selector).load(url,data,callback)

把远程数据加载到被选的元素中

$.ajax(options)

把远程数据加载到 XMLHttpRequest 对象中

$.get(url,data,callback,type)

使用 HTTP GET 来加载远程数据

$.post(url,data,callback,type)

使用 HTTP POST 来加载远程数据

$.getJSON(url,data,callback)

使用 HTTP GET 来加载远程 JSON 数据

$.getScript(url,callback)

加载并执行远程的 JavaScript 文件

(url) 被加载的数据的URL(地址)

(data) 发送到服务器的数据的键/值对象

(callback) 当数据被加载时,所执行的函数

(type) 被返回的数据的类型(html,xml,json,jasonp,script,text)

(options) 完整 AJAX 请求的所有键/值对选项









$(document).ready(function(){

$(“input”).focus(function(){

$(“input”).css(“background-color”,”#FFFFCC”);

});

$(“input”).blur(function(){

$(“input”).css(“background-color”,”#D6D6FF”);

});

});







Enter your name:

请在上面的输入域中点击,使其获得焦点,然后在输入域外面点击,使其失去焦点。













$(document).ready(function(){

$(“input”).focus(function(){

$(“input”).css(“background-color”,”#FFFFCC”);

});

$(“input”).blur(function(){

$(“input”).css(“background-color”,”#D6D6FF”);

});

$(“#btn1”).click(function(){

$(“input”).focus();

});

$(“#btn2”).click(function(){

$(“input”).blur();

});

});







Enter your name:

请在上面的输入域中点击,使其获得焦点,然后在输入域外面点击,使其失去焦点。









发表评论

表情:
评论列表 (有 0 条评论,284人围观)

还没有评论,来说两句吧...

相关阅读