jquery 学习之代码风格对于同一个对象的较多操作,建议每行写一个操作,代码如下:
$(this).removeClass()
.addClass()
.stop()
.fadeTo("fast",0.6)
.fadeTo("fast",1)
.unbind("click")
.click(function(){// do something!
});对于上面的代码,如果嫌代码行数过多,可以以功能块来进换行。
上段代码中,前两个是对class 的操作,接下来3 事动画操作,最后是取消并重新绑定click的事件的处理函数的操作,所以可以写成如下格式的代码:
$(this).removeClass("mouseout").addClass("mouseover")
.stop().fadeTo("fast",0.6).fadeTo("fast",1)
unbind("click").click(function(){// do something!
});对于多个多像的少量操作,可以每个对象写一行,如果涉及子元素,可以考虑适当地缩进。
$(this).addClass("highlight").children("li").show().end().siblings().removeClass("highlight").children("li").hiede();javascript 中的getElementsByTagName 或者getElementById来获取元素节点。
像这样得到的Dom元素就是DOM对象。DOM对象可以使用JavaScript中的方法,var domObj = document.getElementById("id");var ObjHTML= document.innerHTML;$("#foo").html();//获取id为foo的元素内的html代码。.html()是jquery里的方法。这段代码等同于:document.getElementById("foo").innerHTML;在jquery对象中无法使用DOM对象的任何方法。例如$("#id").innerHTML和$("#id").checked之类的写法都是错误的。jquery 对象和DOM对象的相互转换在jquery 对象和DOM 对象的相互转换之前,先约定好定义变量的风格。如果获取的是JQuery对象,那么在变量前面加上$,例如:var $variable = jquery对象;如果获取的是DOM 对象,定义如下:var variable = DOM 对象;如果Jquery没有封装想要的方法,不得不使用DOM对象的时候,有以下两种处理方法。jquery 提供了两种方法将一个jquery对象转换成DOM对象,即[index]和get(index).(1)Juqery对象是一个数组对象,可以通过[index]的方法得到相应的DOM对象。jqeury代码如下: var $cr = $("#cr");  //jqeury对象var cr =  $cr[0];    //DOM 对象alert(cr.checked);   //检测这个checked是否被选中了。(2)另外一种方法jquery本身提供的,通过get(index)方法得到的相应的DOM 对象。jquery代码如下:var $cr = $("#cr");   //jquery 对象var  cr = $cr.get(0); //DOM 对象alert(cr.checked);    // 检测这个checkbox 是否被选中了DOM 对象转成Jquery对象对于一个DOM 对象,只需要用$()把DOM对象包装起来,就可以获得一个jQeury对象了,方式为$(dom对象)。jquery 代码如下:var cr = document.getElementById("cr');  //dom对象var $cr = $(cr);                         //jqeury 对象通过转换后可以可以任意使用jquery中的方法.

转载于:https://www.cnblogs.com/liuyong/archive/2011/03/05/1971746.html

jQuery 学习笔记之二 (jQuery代码风格)相关推荐

  1. JavaScript程序库jQuery学习笔记分享(二)jQuery对象和DOM操作,和其他js库冲突处理

    今天我继续更新jQuery学习笔记,最近考试比较忙,也就更新的比较慢了,这里向大家说一声抱歉,嘻嘻. 让那不愉快的情绪过去吧,继续进行我们的jQuery之旅吧. 一:jQuery对象和DOM对象 1. ...

  2. jQuery 学习笔记之二 (jQuery代码风格)

    jquery 学习之代码风格 对于同一个对象的较多操作,建议每行写一个操作,代码如下: $(this).removeClass() .addClass() .stop() .fadeTo(" ...

  3. jQuery学习笔记(二)

    jQuery学习笔记(二) 二.管理jQuery包装集 1.创建新的元素 使用HTML DOM 创建元素 var select=document.createElement("select& ...

  4. Windows保护模式学习笔记(二)—— 代码跨段跳转

    Windows保护模式学习笔记(二)-- 代码跨段跳转 要点回顾 代码跨段跳转 执行流程 1)段选择子拆分 2)查表得到段描述符 3)权限检查 4)加载段描述符 5)代码执行 6)总结 一致代码段(共 ...

  5. jQuery学习笔记(二)使用选择器一

    jQuery选择器是jQuery框架的基础,jQuery对事件的处理.DOM操作.CSS动态控制.Ajax通信.动画设计都是在选择器基础上进行的 注意,在jQuery中通过各种选择器和方法获取的结果集 ...

  6. jQuery 学习笔记一(认识jQuery jQuery选择器 jQuery中的DOM操作)

    第一章 认识jQuery jQuery代码风格 $(document).ready(function(){ //... }); 简化 $(function(){ //... }); jQuery对象转 ...

  7. Jquery学习笔记:获取jquery对象的基本方法

    jquery最大的好处是将js对html页面的操作(读写)进行了封装,隔离了浏览器的差异性,并简化了操作,和提供了强大的功能. 在web页面中,所有的js操作都是围绕操作dom对象来的.而jquery ...

  8. 软件工程学习笔记《二》代码规范

    文章目录 软件工程学习笔记目录 google代码规范 节选python来自google翻译 错误注释的示例 命名规范 import语句的规范 import this 源码 软件工程学习笔记目录 [ht ...

  9. jQuery学习笔记(二)—— 操作DOM元素

    使用attr()方法控制元素的属性 attr()方法的作用是设置或者返回元素的属性,其中attr(属性名)格式是获取元素属性名的值,attr(属性名,属性值)格式则是设置元素属性名的值. 例如,使用a ...

最新文章

  1. The C10K problem原文翻译
  2. vc6.0开发环境两个辅助工具
  3. FPGA的发展历史及相关名词解释
  4. 【机器学习】5行代码在小数据集上涨点
  5. java继承与多态性_Java继承与多态浅析
  6. 19款探岳刷隐藏教程_三星S10系列如何隐藏导航栏 官微“手把手”教你设置
  7. 智能指针(三):unique_ptr使用简介
  8. transition css3 渐变效果
  9. JS 表单submit() 提交无效的问题
  10. unity实现游戏帧同步之确定性物理引擎
  11. 联想拯救者P7000八代I7 8750H 可以安装WIN7系统吗
  12. 梦三国服务器每天维护几次,梦三国:都在抱怨策划,可扪心自问玩家数量逐渐减少的原因是这些...
  13. Android手机端编程开发软件合集(一)
  14. android系统wifi控制风扇,无线远程遥控风扇设计实现
  15. 树莓派GPIO 基础(二)
  16. ArcEngine连接地理数据库(20190702)
  17. (股票,数字货币)年收益率,标准差和夏普率的计算
  18. 一文看懂网络安全五年之巨变
  19. linux 文件大小写敏感,大小写敏感的问题
  20. 程序员的“良知”是道

热门文章

  1. python学习--关注容易被忽略的知识点---(一)python基础
  2. 2008年下半年软考在即 51CTO将实时提供试题和参考答案
  3. 如何使用GDAL进行图像镶嵌
  4. wps一直显示正在备份怎么办_做了一天的文档被误删?WPS这个功能随时准备帮你兜底...
  5. SpringCloud系列之Nacos+Dubbo+Seata应用篇
  6. 7个现象告诉你手游圈为什么会有寒冬
  7. Adobe AIR移动应用中的文本输入
  8. echart移上去显示内容_Echarts X轴内容过长自动隐藏,鼠标移动上去显示全部名称方法...
  9. 软件测试python测试步骤_软件测试员必备基础:3分钟带你入门自动化测试!
  10. c语言中L''作用,L/C问题: 请问L/C上的49:Confirmation Instruction 有什么作用啊[1]