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阻止冒泡和HTML默认操作
Nov 17 Javascript
jquery中filter方法用法实例分析
Feb 06 Javascript
Javascript闭包(Closure)详解
May 05 Javascript
javascript实现dom动态创建省市纵向列表菜单的方法
May 14 Javascript
jquery使整个div区域可以点击的方法
Jun 24 Javascript
jQuery EasyUI基础教程之EasyUI常用组件(推荐)
Jul 15 Javascript
JS遍历页面所有对象属性及实现方法
Aug 01 Javascript
Node.js读写文件之批量替换图片的实现方法
Sep 07 Javascript
jQuery实现简单的tab标签页效果
Sep 12 Javascript
原生js封装运动框架的示例讲解
Oct 01 Javascript
利用jQuery+localStorage实现一个简易的计时器示例代码
Dec 25 jQuery
layui table 列宽百分比显示的实现方法
Sep 28 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
php5中类的学习
2008/03/28 PHP
用PHP进行MySQL删除记录操作代码
2008/06/07 PHP
深入PHP autoload机制的详解
2013/06/09 PHP
thinkPHP模板中函数的使用方法示例
2016/11/30 PHP
PHP实现动态压缩js与css文件的方法
2018/05/02 PHP
Javascript 检测、添加、移除样式(className)函数代码
2009/09/08 Javascript
javascript获取xml节点的最大值(实现代码)
2013/12/11 Javascript
javascript中全局对象的parseInt()方法使用介绍
2013/12/19 Javascript
jquery常用函数与方法汇总
2015/09/01 Javascript
原生JS实现图片轮播效果
2016/12/26 Javascript
关于ES6的六个小特性(二)
2017/02/20 Javascript
jQuery Collapse1.1.0折叠插件简单使用
2017/08/28 jQuery
Javascript格式化并高亮xml字符串的方法及注意事项
2018/08/13 Javascript
JS栈stack类的实现与使用方法示例
2019/01/31 Javascript
jQuery实现手风琴效果(蒙版)
2020/01/11 jQuery
javascript 代码是如何被压缩的示例代码
2020/05/06 Javascript
解决vue无法侦听数组及对象属性的变化问题
2020/07/17 Javascript
移动端JS实现拖拽两种方法解析
2020/10/12 Javascript
[02:54]DOTA2英雄基础教程 撼地者
2014/01/14 DOTA
Python中正则表达式详解
2017/05/17 Python
Python矩阵常见运算操作实例总结
2017/09/29 Python
python+pyqt5实现KFC点餐收银系统
2019/01/24 Python
python中下标和切片的使用方法解析
2019/08/27 Python
关于pycharm中pip版本10.0无法使用的解决办法
2019/10/10 Python
利用 PyCharm 实现本地代码和远端的实时同步功能
2020/03/23 Python
使用Pycharm在运行过程中,查看每个变量的操作(show variables)
2020/06/08 Python
使用python tkinter开发一个爬取B站直播弹幕工具的实现代码
2021/02/07 Python
css3进行截取替代js的substring
2013/09/02 HTML / CSS
html5 input元素新特性_动力节点Java学院整理
2017/07/06 HTML / CSS
HTML5边玩边学(1)画布实现方法
2010/09/21 HTML / CSS
美国知名玩具品牌:Melissa & Doug
2016/08/16 全球购物
安全检查验收制度
2014/01/12 职场文书
师德个人剖析材料
2014/02/02 职场文书
超市理货员岗位职责
2014/07/04 职场文书
钓鱼岛事件感想
2015/08/11 职场文书
青岛市的收音机研制与生产
2022/04/07 无线电