如何获知脚本所在元素或父元素？

wingfiring 2011-06-20 01:43:46

我有个html片段会被动态载入：

<table>balabala </table>
<script type="text/javascript">
statement
</script>

这个片段会被插入到某个隐藏div内，statement需要得到这个div然后显示它。请问如何得到这个div？
一个迂回的办法是，给table一个唯一的id，然后获得它的父元素。但是，因为html片段可能很多，这个不太容易保证id的无冲突。有更合适的办法吗？

...全文

181 17 打赏收藏转发到动态举报

写回复

用AI写文章

17 条回复

切换为时间正序

请发表友善的回复…

发表回复

cb1156 2011-06-21

打赏
举报

<table>balabala </table>
<script type="text/javascript">
var tabl=document.getElementsByTagName("table");
alert(tabl[tabl.length-1].parentNode);
</script>

这结构。table和script是一个父节点。所以。如果结构不太复杂
可以这样获得

wingfiring 2011-06-21

打赏
举报

#13楼 @KK3K2005 说“代码和HTML互依赖性太高”
我是web新手，确实也有这个担心。但是我又想把相关的东西放在一起，这样，我修改一个功能的时候不容易改了这里，忘了那里。你能给个更好的组织方式的建议吗？

wingfiring 2011-06-21

打赏
举报

给出我实际的代码吧，我在框架页面中留了个div



<div id="dialog"></div>

然后，点击某个链接，动态加载：



function xx_onclick(){

    $.get("page", function(result){$("#dialog").html(result);});

}

在page中：



<table>balabala </table>

<script type="text/javascript">

( function(){

$("#dialog").dialog("option", {...});  //Line 1

$("#dialog").dialog("open");   //Line 2

})();

</script>

现在，我在page中不希望依赖id #dialog.可是我又确实需要获得他。怎么办？

燥动的心 2011-06-20

打赏
举报

[Quote=引用 7 楼 wingfiring 的回复:]

4楼 @pj100 的方法，我已经提到过了，也解释了可行，但是不够好的原因。

[/Quote]
你说ID会冲突是吧，这个怎么会冲突呢，加个时间戳就行了吧。

KK3K2005 2011-06-20

打赏
举报

这个想法不太好代码和HTML互依赖性太高

你就显式的用代码说当我点下某个按钮后某个DIV显示或者关闭很难吗

另外html片断在多也不会冲突 DOM的结构就是一棵树的结构
本质上不会有任何重叠的节点

ziyouren521125 2011-06-20

打赏
举报

要是能知道这个片段的id的话，就方便了
如果可以用jquery 可以这样试试



<table onclick="fn_click(this)">balabala </table>

<script type="text/javascript">  

function fn_click(th)

{

    alert($(th).parent("div").attr("id"));

}

</script>

yibey 2011-06-20

打赏
举报

[Quote=引用 8 楼 wingfiring 的回复:]
回 6楼 @yibey

你那个给函数起名字的方法优点是我确实可以产生那个参数并传给函数，问题是
1.这要求框架和片段约定函数名称。这是内容耦合。而本来我只需要知道片段文件名就行了，内容怎么写无所谓。
2.引入了新名称，要解决名字冲突。
[/Quote]

你说的这2点我没清楚，详细点吧

wingfiring 2011-06-20

打赏
举报

9楼，#aotian16 你连我的意思都没弄明白

aotian16 2011-06-20

打赏
举报

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

 <HEAD>

  <TITLE> New Document </TITLE>

  <META NAME="Generator" CONTENT="EditPlus">

  <META NAME="Author" CONTENT="">

  <META NAME="Keywords" CONTENT="">

  <META NAME="Description" CONTENT="">

  <SCRIPT LANGUAGE="JavaScript">

  <!--

	function hide(e)

	{

		e.srcElement.style.display = "none";

	}

  //-->

  </SCRIPT>

 </HEAD>



 <BODY>

  <INPUT TYPE="button" VALUE="click me" ONCLICK="hide(event)">

 </BODY>

</HTML>

要的是这个吗?

wingfiring 2011-06-20

打赏
举报

回 6楼 @yibey

你那个给函数起名字的方法优点是我确实可以产生那个参数并传给函数，问题是
1.这要求框架和片段约定函数名称。这是内容耦合。而本来我只需要知道片段文件名就行了，内容怎么写无所谓。
2.引入了新名称，要解决名字冲突。

wingfiring 2011-06-20

打赏
举报

4楼 @pj100 的方法，我已经提到过了，也解释了可行，但是不够好的原因。

对于html和javascript我是个新手，看来我要解释一下我为什么这么做。

这个代码片段实际上是个dialog的一部分。而dialog是更大框架页面的一部分。这样的代码片段可能是很多的。我不想，也不可能在载入框架页面时就把所有的东西都加载进来，我希望框架页面最小化，按需加载。这就是我为什么把这样一个片段抽出来。

其次，这样一个片段是有其完整功能的，功能对应的代码我希望和这个片段放在一起并做到局部化，而不是和一个大杂烩一样的脚本文件混在一起。另外，这些代码逻辑也不大，不值得分离到单独的文件。我的目标是模块化和最少约定假设。

这样，这个片段必须不关心谁来引用它，否则我这这种分离就没有意义（导致不能通过id找到父）。这样的片段很多，起一个唯一id可行，但有点难度，因为我不容易发现id重复可能导致的问题（因为可能同时加载多个html片段）。

另外，我使用了jquery和jqueryui，如果能在这两个库的范围内，优美地解决这个问题，我将不胜感激。

yibey 2011-06-20

打赏
举报

不知道你为什么要这么做。
但是如果非要这么做的话
建议这里的<script type="text/javascript">
statement
</script>

脚本语言别当做插入的对象。而是吧它当做初始化就加载好的一个函数，这个函数有一个参数就是当前插入的所在的DIV对象
比如
<script type="text/javascript">
function insertinto(objectDiv)</script>
然后你在你动态载入这个动作的时候同时调用这个函数并且给它传参数当前插入所在的对象。。
我想你在动态载入的地方是可以获得这个对象的吧

挨踢直男 2011-06-20