疯狂Jquery第一天(Jquery学习笔记)


Posted in Javascript onMay 11, 2012

好了开始我的Jquery第一天。
我也是从Hello wrod!开始的。关于jquery 的引用我直接一笔带过。如下:

<html> 
<head> 
<title>jquery 链式操作</title> 
<script type="text/javascript" src="jquery-1.3.1.js"></script> 
<script type='text/javascript'> 
$(document).ready(function(){ 
alert("hello word!"); 
//静止右键点击 
// $(document).bind("contextmenu",function(e){ 
// return false; 
// }); 
}); 
</script> 
</head> 
<body> 
</body> 
</html>

接下来让我们来看看一个复杂的实例,这个实例让我们知道什么是:jquery的链式操作,
我用 . 来连接jquery 的链式操作。
可能有的人刚开始学query ,看起来比较陌生,在后面的疯狂Jquery 中我会一一解释。慢慢的你就会明白。
<html> 
<head> 
<title>Jquery 链式操作</title> 
<script type="text/javascript" src="jquery-1.3.1.js"></script> 
<style type="text/css"> 
#menu {width:300px} 
.has_children { 
background:#555;color:#fff;cursor:pointer; 
} 
.highligt{color:#fff;background:green;} 
div{padding:0;margin:0px;} 
div a { 
background:#888;display:none;float:left;width:300px; 
} 
</style> 
<script type='text/javascript'> 
$(document).ready(function(){ 
// alert("给所有目录添加click 事件"); 
$(".has_children").click(function(){ 
$(this).addClass('highligt') //为当前元素添加highligt类。 
.children("a").show().end() //将子节点的<a>元素显示出来。并且重新定位到上次操作的元素 
.siblings().removeClass("highligt") //获取同级的元素。(或兄弟元素),并且去掉他们highligt类 
.children("a").hide(); //将同级的元素,兄弟元素下的<a> 元素隐藏 
}); 
}); 
</script> 
</head> 
<body> 
<div id='menu'> 
<div class='has_children'> 
<span>第一章 认识Jquery</span> 
<a>1.1 Javascript 和 Javascript库</a> 
<a>1.2 加入Jquery</a> 
<a>1.3 编写简单的Jquery 代码</a> 
<a>1.4 Jquery对象 和 Dom对象</a> 
<a>1.5 解决Jquery 和其他库的冲突</a> 
<a>1.6 Jquery 开发工具和插件</a> 
<a>1.7 小结</a> 
</div> 
<div class='has_children'> 
<span>第二章 Jquery选择器</span> 
<a>2.1 Jquery 选择器是什么?</a> 
<a>2.2 Jquery 选择器的优势?</a> 
<a>2.3 Jquery 选择器</a> 
<a>2.4 应用Jquery改写实例</a> 
<a>2.5 选择器中的一些注意事项</a> 
<a>2.6 案例研究————类似淘宝品牌列表的效果</a> 
<a>2.7 还有其他选择器吗?</a> 
<a>2.8 小结</a> 
</div> 
<div class='has_children'> 
<span>第三章 Jquery中的DOM操作</span> 
<a>3.1 DOM的操作分类</a> 
<a>3.2 Jquery 中的DOM操作</a> 
<a>3.3 案例研究————某网站的超链接和图片效果</a> 
<a>3.4 小结</a> 
</div> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
javascript 建设银行登陆键盘
Jun 10 Javascript
Jquery.TreeView结合ASP.Net和数据库生成菜单导航条
Aug 27 Javascript
按给定几率进行随机抽取的js代码
Dec 28 Javascript
ExtJS自定义主题(theme)样式详解
Nov 18 Javascript
js Date概念详细介绍
Nov 22 Javascript
使用js dom和jquery分别实现简单增删改
Sep 11 Javascript
JS实现仿google、百度搜索框输入信息智能提示的实现方法
Apr 20 Javascript
信息页文内画中画广告js实现代码(文中加载广告方式)
Jan 03 Javascript
bootstrapValidator自定验证方法写法
Dec 01 Javascript
详解解决Vue相同路由参数不同不会刷新的问题
Oct 12 Javascript
Seajs源码详解分析
Apr 02 Javascript
Vue常用传值方式、父传子、子传父及非父子实例分析
Feb 24 Javascript
jQuery 过滤not()与filter()实例代码
May 10 #Javascript
jQuery 在光标定位的地方插入文字的插件
May 10 #Javascript
javascript 在firebug调试时用console.log的方法
May 10 #Javascript
jQueryUI写一个调整分类的拖放效果实现代码
May 10 #Javascript
基于jQuery捕获超链接事件进行局部刷新代码
May 10 #Javascript
让人印象深刻的10个jQuery手风琴效果应用
May 08 #Javascript
jQuery 图片切换插件(代码比较少)
May 07 #Javascript
You might like
Yii框架学习笔记之应用组件操作示例
2019/11/13 PHP
URI、URL和URN之间的区别与联系
2006/12/20 Javascript
JS 显示当前日期与时间的代码
2010/03/24 Javascript
编写高效jQuery代码的4个原则和5个技巧
2014/04/24 Javascript
前端学习笔记style,currentStyle,getComputedStyle的用法与区别
2016/05/28 Javascript
javascript基本语法
2016/05/31 Javascript
详解nodejs微信公众号开发——6.自定义菜单
2017/04/13 NodeJs
JavaScript设计模式之策略模式详解
2017/06/09 Javascript
微信小程序使用wxParse解析html的实现示例
2018/08/30 Javascript
如何解决vue2.0下IE浏览器白屏问题
2018/09/13 Javascript
LayUi数据表格自定义赋值方式
2019/10/26 Javascript
mpvue微信小程序开发之实现一个弹幕评论
2019/11/24 Javascript
实例讲解React 组件生命周期
2020/07/08 Javascript
vue打开子组件弹窗都刷新功能的实现
2020/09/21 Javascript
用Python解决计数原理问题的方法
2016/08/04 Python
tensorflow没有output结点,存储成pb文件的例子
2020/01/04 Python
Python实现链表反转的方法分析【迭代法与递归法】
2020/02/22 Python
关于Keras Dense层整理
2020/05/21 Python
python实现canny边缘检测
2020/09/14 Python
Python基于opencv的简单图像轮廓形状识别(全网最简单最少代码)
2021/01/28 Python
详解如何解决canvas图片getImageData,toDataURL跨域问题
2018/09/17 HTML / CSS
飞利浦比利时官方网站:Philips比利时
2016/08/24 全球购物
固特异美国在线轮胎店:Goodyear Tire
2019/02/23 全球购物
Cinque网上商店:德国服装品牌
2019/03/17 全球购物
普罗米修斯教学反思
2014/02/06 职场文书
会计专业职业规划:规划自我赢取未来
2014/02/12 职场文书
大学生在校学习的自我评价
2014/02/18 职场文书
犯错检讨书
2014/02/21 职场文书
求职信结尾怎么写
2014/05/26 职场文书
见习报告格式范文
2014/11/08 职场文书
2015年办公室文员工作总结
2015/04/24 职场文书
党员进社区活动总结
2015/05/07 职场文书
实习指导老师意见
2015/06/04 职场文书
2016年11月份红领巾广播稿
2015/12/21 职场文书
导游词之阆中古城
2019/12/23 职场文书
Python 数据可视化神器Pyecharts绘制图像练习
2022/02/28 Python