js代码风格之链式结构
<div class="box">
<ul class="menu">
<li class="level1">
<a href="#none">衬衫</a>
<ul class="level2">
<li><a href="#none">短袖衬衫</a></li>
<li><a href="#none">长袖衬衫</a></li>
<li><a href="#none">短袖T血</a></li>
<li><a href="#none">长袖T血</a></li>
</ul>
</li>
<li class="level1">
<a href="#none">卫衣</a>
<ul class="level2">
<li><a href="#none">卫衣1</a></li>
<li><a href="#none">卫衣2</a></li>
<li><a href="#none">卫衣3</a></li>
<li><a href="#none">卫衣4</a></li>
</ul>
</li>
<li class="level1">
<a href="#none">裤子</a>
<ul class="level2">
<li><a href="#none">裤子1</a></li>
<li><a href="#none">裤子2</a></li>
<li><a href="#none">裤子3</a></li>
<li><a href="#none">裤子4</a></li>
</ul>
</li>
</ul>
</div>
<script>
$(".level1>a").click(function(){
$(this).addClass("current")
.next().show()
.parent().siblings().children("a").removeClass("current")
.next().hide();
return false;
});
</script>
<!--
作者:1543177490@qq.com
时间:2017-07-02
描述:(1)对于同一个对象不超过3个操作的,可写成一行,
如:$("li").show().unbind("click");
(2)对于同一对象的较多操作,建议每行写一个
如:$(this).removeClass("mouse")
.addClass("cat")
.stop()
.fadeTo("fast",0.6)
.fadeTo("fast",1)
.unbind("click")
.click(function(){
//to do
});
(3)对多个对象少数操作,可以每个对象写一行,如果有子元素,可以缩进
如:$(this).removeClass("mouse")
.addClass("cat")
.childer("li").show().end()
.siblings().removeClass("over")
.childer().hide();
-->
js代码风格之链式结构的更多相关文章
- 大神的JS代码风格指南
js代码风格指南:1.缩进使用空格,不要用制表符2.必须用分号3.暂时不用ES6(modules)例如export和import命令4.不鼓励(不禁止)水平对齐5.少用var 都应该使用const或者 ...
- Google HTML/CSS/JS代码风格指南
JS版本参见:http://www.zhangxinxu.com/wordpress/2012/07/google-html-css-javascript-style-guides/ HTML/CSS ...
- JS代码风格自动规整工具Prettier
问题背景 通常使用 ESLint做代码风格检查检查, 和部分代码质量检查. 但是使用ESLint在入库时候, 会产生很多的代码修正工作, 需要开发者一个一个的修改. 如果很多,并且时间紧迫,甚是尴尬. ...
- JS代码风格指南
一.基本格式 缩进 建议每级4个空格,可以给编辑器设置tab = 4个空格,自动转换 分号 不要省略分号,防止ASI(自动插入分号)错误 行宽 每行代码不超过80个字符,过长应该用操作符手动断行 断行 ...
- JavaScript之链式结构序列化
一.概述 在JavaScript中,链式模式代码,太多太多,如下: if_else: if(...){ //TODO }else if(...){ //TODO }else{ //TODO } swi ...
- js 代码风格(2)
Properties • 当访问属性的时候,我们使用点(.)操作符. var luke = { jedi: true, age: 28 }; // bad var isJedi = luke[' ...
- JavaScript之链式结构序列化1
一.概述 在JavaScript中,链式模式代码,太多太多,如下: if_else: if(...){ //TODO }else if(...){ //TODO }else{ //TODO } swi ...
- 深入了解jQuery之链式结构
本文是在阅读了Aaron艾伦的jQuery源码解析(地址:http://www.imooc.com/learn/172)后的个人体会以及笔记.在这里感谢艾伦老师深入浅出的讲解!! 1 什么是链式? 先 ...
- 【好玩】将js代码转为日式表情
直接上网址:http://utf-8.jp/public/aaencode.html?src=hello 试试将下面代码执行一下吧: ゚ω゚ノ= /`m´)ノ ~┻━┻ //*´∇`*/ ['_']; ...
随机推荐
- 【JAVAWEB学习笔记】13_servlet
JavaWeb核心之Servlet 教学目标 案例一.完成用户登录功能 案例二.记录成功登录系统的人次 一.Servlet简介 1.什么是Servlet Servlet 运行在服务端的Java小程序, ...
- VS2013各版本激活密钥
Visual Studio Ultimate 2013 KEY(密钥):BWG7X-J98B3-W34RT-33B3R-JVYW9 Visual Studio Premium 2013 KEY(密钥) ...
- Bootstrap实现轮播图
第一步:设计轮播图容器:div.carousel,添加slide平滑切换,并定义id,方便后面采用data属性来触发 <div class='carousel slide' id="t ...
- 微服务框架下的思维变化-OSS.Core基础思路
如今框架两字已经烂大街了,xx公司架构设计随处可见,不过大多看个热闹,这些框架如何来的,细节又是如何思考的,相互之间的隔离依据又是什么...相信很多朋友应该依然存在自己的疑惑,特别是越来越火热的微服务 ...
- 关于Python编码,超诡异的,我也是醉了
Python的编码问题,真是让人醉了.最近碰到的问题还真不少.比如中文文件名.csv .python对外呈现不一致啊,感觉好不公平. 没图说个JB,下面立马上图. 我早些时候的其他脚本,csv都是 ...
- Introducing: Machine Learning in R(转)
Machine learning is a branch in computer science that studies the design of algorithms that can lear ...
- css reset的重置作用(可取还是不可取,取决于你)
一.重置的理由 当今流行的浏览器中,有些都是以自己的方式去理解css规范,这就会到只有的浏览器对css的解释与设计师的css定义初衷相冲突,使得网页的样子在某些浏览器下能正确按照设计师的想法显示.,但 ...
- python之 centos6.7下 python 3.5.2、Django-1.9 安装
在linux6.5中已经自带了python 2 .python 2.6 ,并且yum程序使用的就是自带的python,所以系统自带的python不要随意卸载否则可能导致yum用不了. 测试环境:cen ...
- 用java来实现验证码功能。
昨天在网上看到了一篇关于验证码的文章,很不错,但是有些不尽人意的地方,比如没有考虑到前端传过来的验证码如果是小写的话,那么做验证的时候就会出现错误, 因为java是严格区分大小写的,还有就是验证码会重 ...
- intel hex 格式的几个链接
intel hex GENERAL: INTEL HEX FILE FORMAT Intel Hex文件格式说明 - starspace - 博客园 C# Hex文件转bin文件 - bule - 博 ...