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 相关文章推荐
JavaScript事件委托用法分析
Jan 24 Javascript
贴近用户体验的Jquery日期、时间选择插件
Aug 19 Javascript
javascript手风琴下拉菜单实现代码
Nov 12 Javascript
JS中Select下拉列表类(支持输入模糊查询)功能
Jan 17 Javascript
用director.js实现前端路由使用实例
Jan 27 Javascript
vue+vuex+axio从后台获取数据存入vuex实现组件之间共享数据
Apr 22 Javascript
webpack 1.x升级过程中的踩坑总结大全
Aug 09 Javascript
js定时器+简单的动画效果实例
Nov 10 Javascript
详解Angular2学习笔记之Html属性绑定
Jan 03 Javascript
浅谈vux之x-input使用以及源码解读
Nov 04 Javascript
解决vue使用vant下拉框van-dropdown-item 绑定title值不变问题
Aug 05 Javascript
基于Vue3.0开发轻量级手机端弹框组件V3Popup的场景分析
Dec 30 Vue.js
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
玩转图像函数库―常见图形操作
2006/09/03 PHP
php a simple smtp class
2007/11/26 PHP
php代码把全角数字转为半角数字
2007/12/10 PHP
简单实现限定phpmyadmin访问ip的方法
2013/03/05 PHP
如何使用php判断所处服务器操作系统的类型
2013/06/20 PHP
php获取汉字首字母的函数
2013/11/07 PHP
php数组指针操作详解
2017/02/14 PHP
html数组字符串拼接的最快方法
2009/09/16 Javascript
Extjs入门之动态加载树代码
2010/04/09 Javascript
jQuery+ajax中getJSON() 用法实例
2014/12/22 Javascript
jQueryMobile之Helloworld与页面切换的方法
2015/02/04 Javascript
js实现图片无缝滚动特效
2020/03/19 Javascript
jQuery获取某天的农历日期并判断是否除夕或新年的方法
2016/03/01 Javascript
详解JSON1:使用TSQL查询数据和更新JSON数据
2016/11/21 Javascript
使用ionic(选项卡栏tab) icon(图标) ionic上拉菜单(ActionSheet) 实现通讯录界面切换实例代码
2017/10/20 Javascript
Python入门篇之数字
2014/10/20 Python
python调用java模块SmartXLS和jpype修改excel文件的方法
2015/04/28 Python
Java多线程编程中ThreadLocal类的用法及深入
2016/06/21 Python
Python中音频处理库pydub的使用教程
2017/06/07 Python
Pytorch保存模型用于测试和用于继续训练的区别详解
2020/01/10 Python
python同义词替换的实现(jieba分词)
2020/01/21 Python
Python中bisect的用法及示例详解
2020/07/20 Python
django跳转页面传参的实现
2020/09/17 Python
荷兰DOD药房中文官网:DeOnlineDrogist
2020/12/27 全球购物
毕业生自我推荐
2013/11/04 职场文书
银行办理业务介绍信
2014/01/18 职场文书
主持人婚宴答谢词
2014/01/28 职场文书
中学家长会邀请函
2014/02/03 职场文书
骨干教师考核方案
2014/05/09 职场文书
公司演讲稿开场白
2014/08/25 职场文书
2015年“七七卢沟桥事变”纪念活动总结
2015/03/24 职场文书
2015年监理工作总结范文
2015/04/07 职场文书
MySQL不使用order by实现排名的三种思路总结
2021/06/02 MySQL
mysql外连接与内连接查询的不同之处
2021/06/03 MySQL
Python-OpenCV教程之图像的位运算详解
2021/06/21 Python
Python中的 No Module named ***问题及解决
2022/07/23 Python