php怎么找父控件的相邻控件,JavaScript_jquery查找父元素、子元素(个人经验总结)，使用js或者jquery查找父元素、 - phpStudy...

jquery查找父元素、子元素(个人经验总结)

使用js或者jquery查找父元素、子元素经常遇到。可是用起来总容易混淆，这里统一总结了一下，以后用起来相信会方便好多

这里jquery向上查找父元素 用到的方法：closest() parents() parent()

向下查找子元素 用到的方法：find() children()

js用的是 children[] 属性

html代码

jquery查找父元素子元素

段落1 查找父元素

11closest()向上查找最近的元素(返回零个或一个元素的 jQuery 对象)

21parent()方法

31parent("选择器")方法

---

段落2 查找子元素

查找table2的td find()方法

查找table2的td children()方法

js的children[]属性来查找

tbody2222

js代码：

$(function(){

/************ 查找父元素 *************/

//closest()方法

$("#mytd1").bind("click",function(){

//alert($(this).html());

alert($(this).closest("table").attr("id")); //table1而不是table0

//alert($(this).closest("table").html());

});

//parent()方法

$("#mytd2").bind("click",function(){

//alert($(this).html()); //$(this).html()是21 (this).attr("id")是mytd2

alert($(this).parent().parent().parent().attr("id"));

//.parent()是tr 第二个.parent是tbody。即使没有tbody标签，找到的也是tbody 第三个.parent()是table

//document.write("第一个parent的id:" + $(this).parent().attr("id") + "。 第二个parent的id是:"+$(this).parent().parent().attr("id") + "。 第三个parent的id是:"+$(this).parent().parent().parent().attr("id"));

});

//parent("选择器") parents("选择器")

$("#mytd3").bind("click",function(){

$("p").parent("#div1").css("background", "yellow");//这里换成了p标签。不知道为什么用this找不到元素

//alert($(this).parent("#div").attr("id"));//undefined

alert($(this).parents("div").attr("id"));//div1 注意一个parent parents

});

/************ 查找子元素 *************/

//查找table2的td元素 find()

$("#sectd1").bind("click",function(){

alert($("#table2").find("td").length);

/* $("#table2").find("td").each(function(index,element){

alert($(element).text());

}); */

});

//children()

$("#sectd2").bind("click",function(){

var table = $("#table2");

alert($("#table2").children().children().children("td[id='sectd2']").html());

//children() 是 tbody children()是 tr children("td[id='sectd2']")是td

});

// js的 children[]

$("#sectd3").bind("click",function(){

var table = document.getElementById("table2");

alert(table.children[0].children[2].children[0].innerHTML);

//children[0] 是 tbody children[2]是 第三行的tr children[0]是td

});

});

相关阅读:

PHP常用函数和常见疑难问题解答

Linux安装翻译软件StarDict的步骤(自己的操作总结)

win8/win10系统宽带连接提示错误619怎么办 宽带连接提示错误619的解决方法

CSS3中的@keyframes关键帧动画的选择器绑定

在Sql Server中调用外部EXE执行程序引发的问题

克隆一个新项目的快捷方式

Mac OS X10.11系统正式发布时间曝光

Html注释 Html中标记文字注释的符号

基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用

ThinkPHP使用PHPExcel实现Excel数据导入导出完整实例

C++写注册表项实例

java导出数据库的全部表到excel

MySQL死锁问题分析及解决方法实例详解

asp.net页面中时间格式化的示例