Question

我有以下DOM结构：

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="main">
            <div id="column-1">
                This is the column one text
            </div>
            <div id="column-2">
                <div id="part-1">
                    Part one
                </div>
                <div id="part-2">
                    Part two
                    <script type="text/javascript">
                        alert($(this).parent().html());
                    </script>
                </div>
                <div id="part-3">
                    Part three
                </div>
            </div>
        </div>  

    </body>
</html>

我想要的是获取父（<div id="part-2">）的内容。

问题是指令：alert($(this).parent().html())。

为什么返回null？

（PS：我知道我可以使用<div id="part-2">访问$("#part-2").html()，但父ID可以动态更改这就是我想要使用$(this).parent().html()指令获取父级的原因<） / p>

Answer 1

问题是$(this)并不代表随机javascript中的任何内容。你没有给它一个范围。例如：

$( 'button' ).click( function() { alert( $(this).parent().html() ); } );

在该代码中，$(this)指的是按钮。您需要将一些事件绑定到div，以便您可以使用$(this).parent();

考虑它的另一种方法是，当涉及$(this);

等对象时，javascript相对于HTML元素的位置是无关紧要的。

对于您的代码，您可以添加以下内容：

$( 'div.column-2 div' ).click( function() { alert( $(this).html() ); } );

这将提示您点击的div的HTML，并且它将适用于您示例中的所有三个（第1部分，第2部分和第3部分）

Answer 2

据我所知，你想要显示以前的兄弟而不是父母......试试这个：

$("#part-2").prev().html()

Answer 3

它返回nil，因为DOM不完整，即当JS运行时，div“part-2”没有关闭，所以它无法获取HTML，更不用说父HTML了，如果你把它放在一个按钮，然后它应该工作： http://jsfiddle.net/E9eA8/

jQuery：获取父内容

3 个答案: