由于主要还是负责后端,所以前端很多东西都不熟悉,jQuery作为web开发必备技能,有很多知识点,老是记不清楚,所以在这边整理一下。

1.加载页面后执行

$(function(){
//程序段
})

2.点击事件

$("#xxx").click(function(){
//程序段
})

3.给元素添加class,或者改变class

$("#xxx").addClass("class1");
//点击时候改变样式
$("#aaa").click(function() {
$("#xxx").toggleClass("class1");
});

4.给元素的css,html属性赋值

$("#xxx").css("display","block");
$("#xxx").html("this is html<br/> this is html");

5.获取一个jquery元素

var a=$("#xxx");//获取id为xxx的jquery对象
var b=$(".xxx");//获取class为xxx的jquery对象

6.获取对象的值

$(".xxx").val();//文本框或者下拉框的值
$(".xxx").html();//对象的html内容
var sex=$("#radio1").is(":checked")?"男":"女";//radio1的值
var marry=$("#checkbox1").is(":checked")?"已婚":"未婚";//复选框的值

7.选择器

//基本选择器
$("#table1 tr:nth-child(even)").addClass("trOdd");
$("#divOne").val()//ID为divOne的元素
$(".divOne").val()//class为divOne的元素
$("div span").val()//div下的span元素,注意是空格隔开,表示下级元素
$(".class1 .class2").val()//class为class1下的class为class2的元素,同上
$("#divClass,span").val()//id为divClass或者span元素,都逗号表示或的关系
//层次选择器
$("div span").val();//div下的所有span,祖先跟后代关系,不管是几层嵌套,反正只要是div下的span都选择
$("div>span").val();//div下第一层的span,父子关系,注意只选中第一层span。
$("#divMid + div").val();$("#divMid").next("div").val();//id为divMid的下一个div元素
$("#divMid ~ div").val();$("#divMid").nextAll("div").val();//id为divMid后面的所有div元素
$("#divMid").siblings("div").val();//id为divMid的相邻的div元素

jquery技巧小结的更多相关文章

  1. jquery技巧总结

    jquery技巧总结一.简介 1.1.概述随着WEB2.0及ajax思想在互联网上的快速发展传播,陆续出现了一些优秀的Js框架,其中比较著名的有Prototype.YUI.jQuery.mootool ...

  2. PowerDesigner实用技巧小结(3)

    PowerDesigner实用技巧小结(3) PowerDesigner 技巧小结 sqlserver数据库databasevbscriptsqldomain 1.PowerDesigner 使用 M ...

  3. PowerDesigner实用技巧小结(2)

    PowerDesigner实用技巧小结 1.ORACLE数据库建模时,由于ORACLE的表名.字段名如果是小写会有一定的麻烦,需要将小写转化为大写? (1)在打开pdm的情况下,进入Tools-Mod ...

  4. CentOS系统中的passwd命令实用技巧小结

    这篇文章主要介绍了Linux系统中的passwd命令实用技巧小结,是Linux入门学习中的基础知识,需要的朋友可以参考下   先来回顾一下passwd命令的基本用法: Linux passwd命令用来 ...

  5. 风云流水 jQuery技巧总结 (转)

    jQuery技巧总结 (转) 一.简介 1.1.概述 随着WEB2.0及ajax思想在互联网上的快速发展传播,陆续出现了一些优秀的Js框架,其中比较著名的有Prototype.YUI.jQuery.m ...

  6. github搜索技巧小结

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  7. jquery技巧之让任何组件都支持类似DOM的事件管理

    本文介绍一个jquery的小技巧,能让任意组件对象都能支持类似DOM的事件管理,也就是说除了派发事件,添加或删除事件监听器,还能支持事件冒泡,阻止事件默认行为等等.在jquery的帮助下,使用这个方法 ...

  8. (译)你应该知道的jQuery技巧

    帮助提高你jQuery应用的简单小技巧. 回到顶部按钮 图片预加载 判断图片是否加载完 自动修补破损图像 Hover切换class类 禁用输入 停止正在加载的链接 toggle fade/slide ...

  9. jQuery技巧

    回到顶部按钮 图片预加载 判断图片是否加载完 自动修补破损图像 Hover切换class类 禁用输入 停止正在加载的链接 toggle fade/slide 简单的手风琴 使两个DIV同等高度 在浏览 ...

随机推荐

  1. 4年java开发,该何去何从!

    以前都是一直看,今天楼主第一次发博,还望各位不吝赐教. 今天也没别的要说的,就是吐槽一下楼主这几天的面试遭遇,感觉都有点怀疑人生了. 先说说楼主的情况吧,13年毕业本科计算机专业,到现在一直做java ...

  2. 【2】hadoop搭建准备软件

    准备一:VMware虚拟工具: 链接:http://pan.baidu.com/s/1o7F4A6I 密码:w5ti 准备二:CentOS6.8虚拟机(64位):如果64位不允许安装,可能是电脑设置问 ...

  3. ALTER TABLE SWITCH' statement failed. The table x' is partitioned while index 'x' is not partitioned.

    1.L_Monitoring有这么些字段,ID,Collecttime,PlateType,PlateNO以及其他一些这段.建立这个表的时候是个非分区表,其中ID是主键,并在Collecttime,P ...

  4. 实现验证码图像文字的识别(C#调用DLL)

    请先下载http://asprise.com/product/ocr/index.php?lang=csharp 的SDK.里面提供了详细的OCR方法,如下:   将发现图像框picbVeryfyCo ...

  5. Maven依赖解析

    本文将记录Maven工程中依赖解析机制,内容包括: Maven依赖基本结构 从仓库解析依赖的机制 依赖传递性解析实例 1. Maven依赖基本结构 上篇文章记录了Maven依赖的聚合与继承,POM中依 ...

  6. javaweb-番外篇-Commons-FileUpload组件上传文件

    一.Commons-FileUpload简介 Commons-FileUpload组件 Commons是Apache开放源代码组织的一个Java子项目,其中的FileUpload是用来处理HTTP文件 ...

  7. A computer hardware platform abstraction - part.1

    intro Nowdays every electronic computer is based on  Boole Algebra and Sequential Logic,So my post w ...

  8. HTML Entity 字符实体

    目录 1. HTML Entity 2. 字符与Entity Name的互相转换 3. 字符与Entity Number的互相转换 1. HTML Entity 1.1 介绍 在编写HTML页面时,需 ...

  9. Powershell 远程连接ARM Windows Server VM 并关闭 Firewall

    准备环境:Azure ARM Windows Server 2008 R2 机器 1.登陆机器查看防火墙,是开着的 2.查看机器的监听端口,发现没有Powershell远程管理对应的端口5985或59 ...

  10. A workaround to change shared memory size for Docker containers in AWS ECS

    Issue Because of not supporting to specify the following docker run parameter, containers in ECS can ...