jQuery的一些特性和用法整理小结


Posted in Javascript onJanuary 13, 2010

1.精准简单的选择对象(dom):

$('#element');// 相当于document.getElementById 
("element") 
$('.element');//Class 
$('p');//html标签 
$("form > input");//子对象 
$("div,span,p.myClass");//同时选择多种对象 
$("tr:odd").css("background-color", "#bbbbff");//表格的 
隔行背景 
$(":input");//表单对象 
$("input[name='newsletter']");//特定的表单对象

2.对象函数的应用简单和不限制:
element.function(par); 
$(”p.surprise”).addClass(”ohmy”).show(”slow”)...

3.对已选择对象的操作(包括样式):
$("#element").addClass("selected");//给对象添加样式 
$('#element').css({ "background-color":"yellow", "font 
-weight":"bolder" });//改变对象样式 
$("p").text("Some new text.");//改变对象文本 
$("img").attr({ src: "test.jpg", alt: "Test Image" 
});//改变对象文本 
$("p").add("span");//给对象增加标签 
$("p").find("span");//查找对象内部的对应元素 
$("p").parent();//对象的父级元素 
$("p").append("<b>Hello</b>");//给对象添加内容

4.支持aJax,支持文件格式:xml/html/script/json/jsonp
$("#feeds").load("feeds.html");//相应区域导入静态页内容 
$("#feeds").load("feeds.php", {limit: 25}, function() 
{alert("The last 25 entries in the feed have been 
loaded");});//导入动态内容

5.对事件的支持:
$("p").hover(function () { 
$(this).addClass("hilite");//鼠标放上去时 
}, function () { 
$(this).removeClass("hilite");//移开鼠标 
});//鼠标放上去和移开的不同效果(自动循环所有p对象 
)

6.动画:
$("p").show("slow");//隐藏对象(慢速渐变) 
$("#go").click(function(){ 
$("#block").animate({ 
width: "90%", 
height: "100%", 
fontSize: "10em" 
}, 1000 ); 
});//鼠标点击后宽、高、字体的动态变化

7.扩展:
$.fn.background = function(bg){ 
return this.css('background', bg); 
}; 
$(#element).background("red");
Javascript 相关文章推荐
基于jquery实现发送文章到手机的代码
Dec 26 Javascript
jQuery插件开发汇总
May 15 Javascript
微信小程序(应用号)简单实例应用及实例详解
Sep 26 Javascript
JavaScript纯色二维码变成彩色二维码
Jul 23 Javascript
Angular实现下拉框模糊查询功能示例
Jan 03 Javascript
vue 使用Jade模板写html,stylus写css的方法
Feb 23 Javascript
11行JS代码制作二维码生成功能
Mar 09 Javascript
Vue 报错TypeError: this.$set is not a function 的解决方法
Dec 17 Javascript
Django+Vue实现WebSocket连接的示例代码
May 28 Javascript
JavaScript实现单英文金山打字通
Jul 24 Javascript
小程序实现投票进度条
Nov 20 Javascript
vue移动端弹起蒙层滑动禁止底部滑动操作
Jul 22 Javascript
JavaScript关于select的相关操作说明
Jan 13 #Javascript
海量经典的jQuery插件集合
Jan 12 #Javascript
JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
Jan 12 #Javascript
jquery下操作HTML控件的实现代码
Jan 12 #Javascript
jquery插件 cluetip 关键词注释
Jan 12 #Javascript
Javascript 实现TreeView CheckBox全选效果
Jan 11 #Javascript
javascript下判断一个对象是否具有指定名称的属性的的代码
Jan 11 #Javascript
You might like
使用array mutisort 实现按某字段对数据排序
2013/06/18 PHP
php将access数据库转换到mysql数据库的方法
2014/12/24 PHP
php提取身份证号码中的生日日期以及验证是否为成年人的函数
2015/09/29 PHP
php array_walk_recursive 使用自定的函数处理数组中的每一个元素
2016/11/16 PHP
php实现网页端验证码功能
2017/07/11 PHP
js日期相关函数总结分享
2013/10/15 Javascript
javascript放大镜效果的简单实现
2013/12/09 Javascript
js实现兼容IE和FF的上下层的移动
2015/05/04 Javascript
jquery实现两边飘浮可关闭的对联广告
2015/11/27 Javascript
深入理解关于javascript中apply()和call()方法的区别
2016/04/12 Javascript
Javascript中浏览器窗口的基本操作总结
2016/08/18 Javascript
js定时器实例分享
2016/12/20 Javascript
BootstrapTable请求数据时设置超时(timeout)的方法
2017/01/22 Javascript
JavaScript实现浅拷贝与深拷贝的方法分析
2018/07/05 Javascript
Vuejs+vue-router打包+Nginx配置的实例
2018/09/20 Javascript
Angular7创建项目、组件、服务以及服务的使用
2019/02/19 Javascript
Node.js + express基本用法教程
2019/03/14 Javascript
详解vue之自行实现派发与广播(dispatch与broadcast)
2021/01/19 Vue.js
如何管理Vue中的缓存页面
2021/02/06 Vue.js
[02:22]《新闻直播间》2017年08月14日
2017/08/15 DOTA
Python写的一个简单DNS服务器实例
2014/06/04 Python
pandas DataFrame 根据多列的值做判断,生成新的列值实例
2018/05/18 Python
Python实现提取XML内容并保存到Excel中的方法
2018/09/01 Python
python单例模式获取IP代理的方法详解
2018/09/13 Python
python随机在一张图像上截取任意大小图片的方法
2019/01/24 Python
Python二次规划和线性规划使用实例
2019/12/09 Python
澳大利亚排名第一的狂热牛仔品牌:ONETEASPOON
2018/11/20 全球购物
最热门的自我评价
2013/12/30 职场文书
24岁生日感言
2014/01/13 职场文书
会计电算化个人求职信范文
2014/01/24 职场文书
应急处置方案
2014/06/16 职场文书
2014年镇党建工作汇报材料
2014/11/02 职场文书
技术员岗位职责
2015/02/04 职场文书
Java Dubbo框架知识点梳理
2021/06/26 Java/Android
vue 实现弹窗关闭后刷新效果
2022/04/08 Vue.js
HttpClient实现文件上传功能
2022/08/14 Java/Android