jquery选择器中的find和空格,children和>的区别、及父节点兄弟节点,还有判断是否存在的写法
一、find和空格,children和>及其它的区别
空格:$('parent childchild')表示获取parent下的所有的childchild节点(所有的子孙)。
等效成 ==$('parent').find('children') 获取子节点 offspring
获取所有子孙节点$('parent *')
大于号:$('parent > child')表示获取parent下的所有child的儿子( 第一代)。
等效成 ==$('parent').children('children') 获取亲子节点 children
$('parent > *') 获取所有亲子节点
Query.parent(expr) //找父元素
jQuery.parents(expr) //找到所有祖先元素,不限于父元素
jQuery.prev() //查找上一个兄弟节点,不是所有的兄弟节点
jQuery.prevAll() //查找所有之前的兄弟节点
jQuery.next() //查找下一个兄弟节点,不是所有的兄弟节点
jQuery.nextAll() //查找所有之后的兄弟节点
jQuery.siblings() //查找兄弟节点,不分前后
jQuery.find(expr) //跟jQuery.filter(expr)完全不一样,jQuery.filter(expr)是从初始的
jQuery对象集合中筛选出一部分,而jQuery.find()的返回结果,不会有初始集中
筛选出一部分,比如:
$("p").find("span")是从元素开始找,等于$("p span")
二、检测匹配元素是否存在的两种写法
在传统的JavaScript里,当我们对某个页面元素进行某种操作前,最好先判断这个元素是否存在。原因是对一个不存在的元素进行操作是不允许的。
例如:
[html] view plain copy
document.getElementById("someID").innerHTML("hi"); 如果ID为"someID"的元素不存在,我们将得到Javascript运行错误:document.getElementById("someID") is null
正确的写法应该是:
[html] view plain copy
obj = document.getElementById("someID");
if (obj){
obj.innerHTML("hi");
}
那么在jQuery,我们如何判断页面元素存在与否呢?如果参照上面的传统Javascript的写法,我们第一个想到的办法一定是:
[html] view plain copy
if ($("#someID")){
$("#someID").text("hi");
} 可是这么写是不对的!因为jQuery对象永远都有返回值,所以$("someID") 总是TRUE ,IF语句没有起到任何判断作用。正确的写法应该是:
[html] view plain copy
if ( $("#someID").length > 0 ) {
$("#someID").text("hi");
} 注意 :判断某个页面元素存在与否在jQuery实际上是没有必要的,jQuery本身会忽略 对一个不存在的元素进行操作,并且不会报错
[html] view plain copy
$(document).ready(function(){
var value=$('#btn_delXml').length;
if(value>0){
alert('Extsts');
}else {
alert('not Extsts');
}
})
jquery选择器中的find和空格,children和>的区别、及父节点兄弟节点,还有判断是否存在的写法的更多相关文章
- jquery选择器中两个class是什么意思?
jquery选择器中两个class是什么意思? $(".class1 .class2") 选择class1元素下class2的元素(中间有空格)$(".class1.cl ...
- 处理jQuery选择器中的特殊符号,如(、#等
前几天解决一个外网问题,客服反馈页面数据加载不出来,首先看一下服务端日志也没报错异常,自己测试了一下,在chrome的Console发现有js报错,原来是js报错导致的数据加载不出来. 调试了一番,发 ...
- jQuery选择器中的特殊符号和关键字
一般情况下,在jQuery选择器中,我们很少会用到诸如"."."#"."("."["等特殊字符,因为根据W3C规定,HT ...
- js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...
- jquery 获取元素(父节点,子节点,兄弟节点),元素筛选
一, js 获取元素(父节点,子节点,兄弟节点) var test = document.getElementById("test"); var parent = test.p ...
- jQuery选择器中的空格问题
前几天就遇到过这样的问题,明明我用的是('tr :even').css('background','#ccc')想改变表格中行的背景色,反复试了还是没改变.还问了度娘还是没找到原因所在(当时问题描述的 ...
- jQuery选择器中空格的问题再探究
jQuery选择器的空格问题,看似很小,但是差之毫厘谬以千里,让人很是恼火,<锋利的jQuery>书中有个经典的例子,我这里也拷贝下来,再加点自己的想法 <html> < ...
- jquery选择器中中>和空格的区别
空格:$('parent childchild')表示获取parent下的所有的childchild节点 大于号:$('parent > childchild')表示获取parent下的所有下一 ...
- JQuery选择器中的一些注意事项
1. 选择器中含有特殊符号的注意事项 1. 1 选择器中含有",","#","("或"]"等特殊字符 根据w3c的规定, ...
随机推荐
- 手机端网页web开发要点
1.初始化 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...
- inline-block元素的4px空白间距解决方案
http://www.jb51.net/css/68785.html inline-block元素的4px空白间距解决方案
- 吴恩达机器学习笔记(三) —— Regularization正则化
主要内容: 一.欠拟合和过拟合(over-fitting) 二.解决过拟合的两种方法 三.正则化线性回归 四.正则化logistic回归 五.正则化的原理 一.欠拟合和过拟合(over-fitting ...
- Android平台及其架构(部分转载)
一.Android的系统架构 1. 应用程序 同Android系统一起发布的核心应用程序,如email 客户端,SMS 短消息程序,日历,地图,浏览器,联系人管理程序等. 这些应用程序都是用 ...
- bash rz 上传文件失败问题
原文链接: https://blog.csdn.net/heavendai/article/details/7549065 单独用rz会有两个问题:上传中断.上传文件变化(md5不同), 解决办法是上 ...
- 算法(Algorithms)第4版 练习 1.3.42
After copy Left on Stack r: be to not or be to Left on Stack copy: be to not or be to After r pop Le ...
- 大话设计模式--命令模式 Command -- C++实现实例
1. 命令模式: 将请求封装为一个对象,从而使你可以用不同的请求对客户进行参数化,对请求排队或记录请求日志,以及支持可撤销的操作. 命令模式有点: a. 较容易的设计一个命令队列 b. 在需要的的情况 ...
- spring 4 + jpa(hibernate 3/4) + spring mvc 多数据源配置
先从persistence.xml开始: <?xml version=”1.0″ encoding=”UTF-8″?><persistence version=”2.1″ xmlns ...
- 分享知识-快乐自己:运行(wordcount)案例
运行 wordcount 案例: 一):大数据(hadoop)初始化环境搭建 二):大数据(hadoop)环境搭建 三):运行wordcount案例 四):揭秘HDFS 五):揭秘MapReduce ...
- selenium-查看selenium API
pydoc是Python自带的模块,主要用于从python模块中自动生成文档,这些文档可以基于文本呈现的.也可以生成WEB 页面的,还可以在服务器上以浏览器的方式呈现! 一.pydoc 1.到底什么是 ...