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 ...
随机推荐
- Android中使用SoundPool来播放音频
今天找素材重做FlappyBird时学习了一下怎样为应用设置背景音频,发现通过封装SoundPool类就能够非常好的做到这一点. SoundPool类比較适合播放一些类似游戏音效这样的比較短促并且较小 ...
- redis4安装
第一步官网下载 https://redis.io/ rz 上传或者直接wget http://download.redis.io/releases/redis-4.0.2.tar.gz 2.将其下 ...
- DataGridView使用技巧四:删除行操作
一.无条件的删除行 默认时,DataGridView是允许用户进行行的删除操作,选中要删除的行,按Delete键可以删除,该操作没有任何提示(只是删除界面显示的数据,不会真实删除数据库中的数据).如果 ...
- SSI——服务器端嵌入
服务器端嵌入:Server Side Include,是一种类似于ASP的基于服务器的网页制作技术.大多数(尤其是基于Unix平台)的WEB服务器如Netscape Enterprise Server ...
- node-webkit读取json文件
1.原理 node-webkit包含了node.js,node.js提供了处理json数据文件的方法,通过node.js提供的方法,我们可以比较方便地读取json文件. 2.示例 这里我们读取的文件是 ...
- 一个极其高效的虚拟机内存冗余消除机制:UKSM
Linux内核机制KSM(Kernel Samepage Merging)能合并KVM虚拟机之间相同内存的页面,被CentOS, RHEL之类的服务器内核广泛采用,但是其速度很慢.UKSM(Ultra ...
- chrome 如何利用快捷键将光标移动到地址栏
Windows: Ctrl + L 或 Alt + D 或 F6 Mac: Command + LLinux: Ctrl + L
- Docker之删除container和image
删除所有停止的container: docker rm $(docker ps -a -q) 删除所有未标记的image docker rmi $(docker images | grep " ...
- nginx反向代理压测问题记录
使用nginx反向代理压测web程序,100个用户并发时,每隔一段时间loadrunner工具中就会报错,报错信息如下: Continuing after Error -26610: HTTP Sta ...
- android Fragment 笔记
Fragment多用于平板中,Fragment当成Activity的一个界面的一个组成部分,Fragment有自己的生命周期,但是必须依托在Activity中. 参考链接 https://develo ...