iframe在开发中多多少少会用到,尤其是在开发系统时,但是这会让我们前端面临一个问题,那就是如果iframe嵌套过多了就会导致元素获取不到,或者是不好获取,那么,iframe中如何获取子级和父级元素呢?今天我把我们常用的方法做了一个总结,方便日后查看学习,也为后来的小伙伴提供参考。推荐阅读《 iframe的初步认识》《iframe安全性探索》《iframe自适应之广告设计》

父级获取子级元素:

window.frames[iframe的name属性值];

调用方法:

document.getElementById(“子页面元素ID”).contentWindow.子页面方法名;

document.getElementsByTagName(“子页面元素标签名”)[i].contentWindow.子页面方法名;

document.getElementsByClassName(“子页面元素类名”)[i].contentWindow.子页面方法名;

子级获取父级元素:

window.parent.document.getElementById(“父页面元素ID”);

window.parent.document.getElementsByTagName(“父页面元素标签名”)[i];

window.parent.document.getElementsByClassName(“父页面元素类名”)[i];

调用方法:

window.parent.父页面方法;

jQuery获取

父级查找子级元素:

$(iframe选择器).contents().find(iframe中元素选择器);

调用方法:

$(iframe选择器)[0].contentWindow.子页面方法名;

子级向上查找父级元素:

$(父页面元素选择器, window.parent.document);

window.parent.$(父页面元素选择器)window.parent.父页面方法;

调用方法:

window.parent.父页面方法;

当嵌套三层,或者更多时:

$('iframe').contents().find('iframe').contents().find("iframe")......

东西很简单,当做笔记记录一下。

iframe在开发中多多少少会用到,尤其是在开发系统时,但是这会让我们前端面临一个问题,那就是如果iframe嵌套过多了就会导致元素获取不到,或者是不好获取,那么,iframe中如何获取子级和父级元素呢?今天我把我们常用的方法做了一个总结,方便日后查看学习,也为后来的小伙伴提供参考。推荐阅读《 iframe的初步认识》《iframe安全性探索》《iframe自适应之广告设计》JS获取父级获取子级元... document.getElementBy Id ('childFrm').contentWindow.document.getElementsByClassName('childClass'); // 获取 页面 的对象,这个地方曾尝试使用jQuery,但是不知道为什么不行,只能用原生的 子 页面 获取 页面 元素 方法 : $("#child Id ",paren... 标签 ( id = “show1”) onclick触发事件,参数传入this。目的是通过this确定子标签。 <div id ="show1" style="height:14px;margin-top:23px;margin-left:49px;margin-right: 14px;"> <img src="~/Content/images/9.png" /&gt &lt;ul id ="munutopviews"&gt; &lt;li&gt; &lt;a href="javascript:_M(0,'home.php?file=new')" class="return-home"&gt;首页&lt;/a&gt;
### 回答1: 在 js ,树形结构数据最常见的形式是一个 嵌套 数组,其 每个 元素 都代表一个节点,包含了节点的属性和子节点数组。如果我们要根据当前节点 id 获取 其所有的 节点 id ,需要进行递归操作。 首先,我们需要寻找当前节点在树形结构 的位置,可以通过遍历整个数组来寻找。如果找到了当前节点,就可以继续递归查找其 节点,直到根节点。 递归查找 节点的 方法 可以通过传入参数来实现。在每个递归函数 ,我们都可以将当前节点的 节点 id 作为参数传入,并将其插入到结果数组 ,然后继续递归查找 节点的 节点,直到根节点为止。 具体实现的伪代码如下: function findParents(treeData, node Id , result, parent Id ) { for (var i = 0; i < treeData.length; i++) { var node = treeData[i]; if (node. id === node Id ) { result.unshift(parent Id ); if (parent Id ) { findParents(treeData, parent Id , result, node.parent Id ); break; } else if (node.children && node.children.length > 0) { findParents(node.children, node Id , result, node. id ); 在这个递归函数 ,第一个参数是整个树形数据,第二个参数是当前节点的 id ,第三个参数是保存 节点 id 的结果数组,第四个参数是当前节点的 节点 id 。当找到当前节点时,将其 节点 id 插入到结果数组 ,并继续递归查找其 节点,直到根节点为止。 通过这个递归函数,我们就可以根据树形数据和当前节点的 id 获取 其所有的 节点 id 了。 ### 回答2: JS 树形结构是一个常见的数据结构,其 每个节点都可以有其 若干个子节点,而每个子节点也可以有其下属子节点,从而形成一棵具有階次关系的树形结构。 当我们需要根据某个节点 获取 节点 ID 时,我们可以使用递归来实现。具体步骤如下: - 首先,我们需要 获取 与给定 ID 相关联的节点数据。如果树形数据存储在数组 ,则我们可以通过循环遍历整个数组来找到该节点。 - 接下来,我们需要判断当前节点是否为根节点,如果是则返回null,因为根节点没有 节点。 - 如果当前节点不是根节点,则我们需要继续递归地向上查找其祖先节点,直到找到根节点。为此,我们可以调用函数本身,并将当前节点的 节点 ID 作为参数传递到函数 。 - 如果我们找到根节点,则可以停止递归,并将其 节点 ID 返回。如果找不到根节点,则说明给定的 ID 是不合法的,可以返回null或抛出异常。 下面是一个示例代码,它使用递归来 获取 指定节点的祖先节点: function getParentNode Id (treeData, node Id ) { // 查找指定 ID 节点的数据 for (let i = 0; i < treeData.length; i++) { if (treeData[i]. id == node Id ) { // 如果当前节点是根节点,则返回null if (!treeData[i].parent Id ) { return null; // 否则递归查找 节点 ID return getParentNode Id (treeData, treeData[i].parent Id ); // 如果找不到指定 ID 节点,则返回null return null; 在实际应用 ,我们可以根据具体需求对该函数进行扩展,例如增加是否返回完整的 节点数据等功能。 ### 回答3: 在 js 树形结构 ,我们通常需要根据树形数据和当前 id 来递归 获取 节点 id 。实现该功能的基本思路是:首先根据当前 id 查找包含该 id 的节点,然后递归查找该节点的 节点直到根节点,最后返回根节点的 id 。 具体实现过程如下: 1. 定义一个函数,命名为getTreeParent Id ,该函数有两个参数:treeData和current Id 。其 ,treeData是整棵树的数据,current Id 是需要查找的节点 id 。 2. 在函数 定义一个变量,命名为parent Id ,并将其初始化为null。 3. 遍历整个树形数据,查找包含current Id 的节点。 4. 如果找到了该节点,就把该节点的 节点 id 赋值给parent Id ,并结束遍历。 5. 如果没有找到该节点,则递归遍历当前节点的子节点,直到找到为止。 6. 最后返回parent Id ,即为该节点的 节点 id 。 下面是一个实现示例: function getTreeParent Id (treeData, current Id ) { var parent Id = null; for (var i = 0; i < treeData.length; i++) { var node = treeData[i]; if (node. id === current Id ) { parent Id = node.parent Id ; break; if (node.children && node.children.length > 0) { parent Id = getTreeParent Id (node.children, current Id ); if (parent Id ) { break; return parent Id ; 上述代码实现了根据树形数据和当前 id 递归 获取 节点 id 的功能。使用时,只需调用该函数并传入treeData和current Id 参数即可。 需要注意的是,上述代码假定树形数据的每个节点都有一个唯一的 id ,并且每个节点的parent Id 为null或者他的 节点的 id 。如果树形数据的结构不同,需要进行相应的修改。