JQuery 用法总结
1、隐藏与显示,用于div等等
//隐藏id=myTab下的所有li标签
$("#myTab li").hide(); //动画隐藏,1秒内隐藏该对象
$("#myTab li").hide(); //显示class=loginp下的第三个span标签
$(".loginp span:eq(2)").show(); //隐藏ul下的第一个li标签
$("#myTab").find("li:eq(0)").css("display", "none");
$("#myTab").find("li:first").css("display", "none"); //隐藏ul下的最后一个li标签
$("#myTab").find("li:last").css("display", "none");
2、匹配元素
//匹配包含给定属性的元素
//查找所有含有ID属性的div元素
$("div[id]") //匹配给定的属性是某个特定值的元素
//name属性值为basketball的input元素选中
$("input[name='basketball']").attr("checked",true); //匹配给定的属性是不包含某个特定值的元素
//name属性值不为basketball的input元素选中
$("input[name!='basketball']").attr("checked",true);
//此选择器等价于:not([attr=value])要匹配含有特定属性但不等于特定值的元素,请使用[attr]:not([attr=value])
$("input:not(input[name='basketball'])").attr("checked",true); //匹配给定的属性是以某些值开始的元素
//查找所有 name 以 'foot' 开始的 input 元素
$("input[name^='foot']").attr("checked",true); //匹配给定的属性是以包含某些值的元素
//查找所有 name 包含 'sket' 的 input 元素
$("input[name*='sket']").attr("checked",true); //复合属性选择器,需要同时满足多个条件时使用
//找到所有含有 id属性,并且它的 name属性是以 ball结尾的
$("input[id][name$='ball']").attr("checked",true); //$(":contains(text)") text 为规定要查找的文本。
$("p:contains('cang')"); //匹配所有包含 cang 文本内容的 p 元素
$("p:contains('cang')[innerHTML='cang']"); //contains 方式精确查找,只查找文本内容为 cang 的。
3、更改标签的属性和值。
//更改id=A1的onclick属性
$("#A1").attr("onclick", "javascript:void(0);");
document.getElementById("A1").setAttribute("onclick", "javascript:void(0);"); //更改id=A1的href属性
$("#A1").attr("href", "javascript:getcc();"); //更改id=A1的span标签的值
$("#A1 span").html("Hello World"); //更改id=A1的td的值
$("#A1").html("<span style=\"color: red;font-size:large;align=center;\">Hello World</span>"); //更改class=A1的div的值
$(".A1").html("Hello World"); //更改textarea标签的值
$("#textatrea1").val("Hello World");
4、锁死input框,disabled的属性
//锁死id=A1的input
$("#A1").attr("disabled", "disabled"); //打开
$("#A1").attr("disabled", false);
5、each遍历
//遍历所有
$("*").each(function() {
}); //遍历所有Class=ssss的
$(".ssss").each(function() {
//判断td的值=
if ($.trim($(this).text())=="Hello World") {
//查找td的上一级,然后找到并修改第2个td的值
$(this).parent().find("td:eq(1)").text("Hello World Too");
}
}); //遍历所有type=text
$(":text").each(function() {
}); //遍历所有div
$("div").each(function() {
});
6、选中单选框,获取单选框的选中值
//选中第一个值
$("input[name=IS_PGXM]").get().checked = true;
//获取选中的值
var type = $("input[name='type']:checked").val();
7、修改form的action,并提交
$("#Form1").attr("action","/Home/Index");
$("#Form1").submit();
8、添加、删除class
//直接添加class属性
$(’#id’).addClass(’demo’);
//先隐藏再删除class属性
$(’#id’).hide().removeClass(’demo’);
9、当文档载入完毕再执行
//当文档载入完毕再执行
$(function(){ }
10、用jQuery写一段代码,查找id为content的下一个兄弟节点里面class为line的所有DOM元素,并让这些DOM依次隐藏(间隔50毫秒)
var $lines = $("#content").next().find(".line");
for (var i = 0; i < $lines.length; i++) {
(function($this,i){
setTimeout(function(){
$this.hide();
},i*50)
})($($lines[i]),i)
}
11、给class为A1增加居中属性
$(".A1").css("text-align", "center");
12、去掉空白
$.trim(" abc ") //结果:abc function trim(str) {
return str.replace(/(^\s+)|(\s+$)/g, "");
}
trim(" abc ") //结果:abc
13、弹出框(与JQuery无关)
window.prompt("请输入昵称!")
JQuery 用法总结的更多相关文章
- 总结几个关于 jQuery 用法
有关 jquery 用法 目录: $.trim() $.inArray() $.getJSON() 事件委托 on 遍历closest() ajaxSubmit() 拖拽排序 dragsort() 进 ...
- JS和jQuery用法区别
目录 JS和jQuery用法区别 外观区别 查找元素 操作标签 操作内容 操作属性 操作位置 操作样式 事件 JS和jQuery用法区别 外观区别 jQuery与JS最直观的区别就是外观上jQuery ...
- jQuery用法小结
jQuery加载1.$(document).ready()2.添加css样式:单个:$("p").css("color","red"); 多 ...
- jquery用法大全
jQuery 选择器 选择器 实例 选取 * $ ...
- (ajax)——jquery用法
例子:/* ajax获得状态 */ 点击事件 $("#findBycname").click(function(){ var company = ...
- jquery用法第二波
过滤器 属性过滤选择器: $("div[id]")选取有id属性的<div> $(“#id”) $("div[title=test]")选取titl ...
- jquery用法初探
JQuery选择器 JQuery选择器用于查找满足条件的元素,比如可以用$(“#控件Id”)来根据控件id获得控件的jQuery对象,相当于getElementById: 1.id 选择器 $(“ ...
- jquery $用法
//页面刷新时,根据筛选条件中已有的项给下面条件添加样式 window.onload = function() { $("input.query1").each(function( ...
- Jquery用法
$this.closest("dd").addClass("selected").siblings().removeClass("selected&q ...
随机推荐
- [LintCode]计算两个数的交集(二)
问题分析: 用两个指针分别遍历即可. 问题求解: public class Solution { /** * @param nums1 an integer array * @param nums2 ...
- thymeleaf+bootstrap,onclick传参实现模态框中遇到的错误
一个困扰了N久的问题... 网上大多帖子是这么写的 onclick调javascript函数时,不能直接使用onclick=“editUser(${prod.id})”,这样会报错,需要修改成如下的格 ...
- 30个实用的jQuery选项卡/导航教程推荐
很多网站设计中都使用了选项卡(tabs),在制作选项卡时应用jQuery能够实现很多炫酷的过渡和动画效果.本文为你介绍30个实用的jQuery选项卡教程,希望对你有帮助. 1. Animated Ta ...
- thinkphp 连接mssql 当local失效时
<?php return array( //'配置项'=>'配置值' //'USERNAME'=>'admin', //赋值 //数据库配置信息 'DB_TYPE' => 'm ...
- 关于只能上QQ而其他电脑软件(IE/优酷/腾讯视频...)不能联网的解决
1.应该是Winsock协议配置有问题,所以进行一下重置工作. 开始-cmd-输入netsh winsock reset命令来重置Winsock目录重新初始化网络环境来恢复网络畅通-重启电脑才能生效 ...
- Spring 4 官方文档学习(五)核心技术之SpEL
题外话 官方文档用evaluate这个单词来描述从表达式中获得实际内容的过程.如果直译的话,应该是评估.估值之类的意思.个人以为翻译成解析更易懂,但parse已经是解析了,为了避免冲突,就只好保留了e ...
- 解决只有单引号的Json格式转换成bean问题
objectMapper.configure(Feature.ALLOW_UNQUOTED_FIELD_NAMES, true);单引号类似Json格式:{id:124463277,code:null ...
- Zookeeper 应用程序
Zookeeper为分布式环境提供灵活的协调基础架构.ZooKeeper框架支持许多当今最好的工业应用程序.我们将在本章中讨论ZooKeeper的一些最显着的应用. 雅虎 ZooKeeper框架最初是 ...
- (转)分析kernel的initcall函数
分析kernel的initcall函数 来源: ChinaUnix博客 日期: 2008.07.19 21:24 (共有条评论) 我要评论 分析kernel的initcall函数Autho ...
- HGNC 数据库-人类基因组数据库
HGNC 全称为HUGO Gene Nomenclature Committee, 叫做 HUGO基因命名委员会,负责对人类基因组上包括蛋白编码基因, ncRNA基因,甲基因和其他基因在内的所有基因提 ...