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´)ノ ~┻━┻ //*´∇`*/ ['_']; ...
随机推荐
- Windows 2008 R2下 如何简单使用IIS来配置PHP网站
虽然PHP网站配置一般大多数人可能会联想到用Apache+php+mysql来配置,但是呢,如果是为了安全性考虑或者是说是为了便捷高效快速的完成工作,那么Apache+php+mysql这个配置工作就 ...
- Openstack & Ansible
Opennstack Open source software for creating private and public clouds Manages the servers at these ...
- UILabel图文混排显示图片和文字
//传入文字 自动图片放在左边文字紧接着后排排布 -(void)setAttrDetailLabelWithTitle:(NSString *)title { NSMutableAttributedS ...
- Flight学习(一)
翻看git时看到有新消息提示,点进去第一个就是Flight,那么今天就简单来翻译和了解一下这个框架吧,锻炼下自己的英文文档阅读能力,同时也熟悉下JavaScript.时间太赶,难免出现翻译失误和错误, ...
- kafka 0.8.2 消息消费者 consumer
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...
- HeadFirst SQL 读书摘要
数据库都是用 圆柱形表示的. 数据库中包含表 表中包含行和列 行又叫记录record, 列又叫 字段field 创建数据库 create database mypipe_l; 选择数据库 use m ...
- vue实例的几个概念
1.构造器 vue应用都是通过vue构造函数创建实例来启动的,在创建vue实例时需要传入一个options对象,该对象可以包含数据.模板.挂在元素.方法.生命周期钩子等选项: var vm = new ...
- Python教程(2.7)——条件分支
像其它语言一样,Python也有条件分支. 例如,输入用户年龄,可能需要判断是否成年,并做出不同反应.这就需要用到条件分支. if条件分支 if条件分支的一般格式如下: if condition: s ...
- DOUAudioStreamer 中kqueue的应用
DOUAudioStreamer是一个基于Core Audio的流式音频播放器,其中的DOUAudioEventLoop通过kqueue来控制音频的各种状态. kqueue简介(详情请看官方manua ...
- Android 的 SDK Manager 无法启动 闪退解决方法
[故障描述] 做 Android 开发就要下载 Android SDK,其中的 SDK Manager.exe 无法启动,一闪而过. 尝试重装 JDK.重新从官网下载 Android SDK.添加环境 ...