Javascript 如何在没有起始参考点的情况下获取父节点？

我想为我的web应用程序提供一种方法，允许用户在其代码中的任何位置（在脚本标记内）调用我的函数，以显示淡入/淡出消息。我不知道如何在没有起始参考点的情况下确定我在DOM中的位置

功能：

function displayMessage(message) {
    // Display a notification if the submission is successful.
    $('<div class="save-alert">' + message + '</div>')
        .insertAfter($('')) // Do not know how to know where to put the message.
        .fadeIn('slow')
        .animate({ opacity: 1.0 }, 2000)
        .fadeOut('slow', function () {
        $(this).remove();
    });
}

功能显示消息（消息）{
//如果提交成功，则显示通知。
$（''+消息+''）
.insertAfter（$（''）//不知道如何知道将消息放在何处。
.fadeIn（“慢”）
.animate（{opacity:1.0}，2000年）
.fadeOut（'slow'，function（）{
$（this.remove（）；
});
}

HTML：

<!-- Some HTML -->
<div>
    <script type="text/javascript">
        displayMessage("My message.");
    </script>
</div>
<!-- Some more HTML. -->

显示消息（“我的消息”）；

没有任何可靠的方法获取此信息。您应该像大多数其他库一样，让用户将元素的ID或引用传递给您的

displayMessage

函数，以便您可以使用它。

没有任何可靠的方法来获取此信息。您应该像大多数其他库一样，让用户将元素的ID或引用传递给您的

displayMessage

函数，以便您可以使用它。

您可能希望使用它将框放置在相对于浏览器视口的位置，无论用户在文档中滚动到何处。

您可能希望使用将框放置在相对于浏览器视口的位置，无论用户在文档中滚动到何处。

除非您希望将css选择器或id作为参数，否则还有一种替代方法可以创建jQuery小部件。这样，您可以像这样使用它：

$("#msgArea").messageWidget("displayMessage");

甚至多次重复使用

$("#msgArea").messageWidget("displayMessage", "message to display");

示例样板小部件：

(function( $ ) {
    $.widget("ui.messageWidget", {
        // default options
        options: { message: undefined},
        // constructor
        _create: function() {
            if (this.options.message !== undefined) {
                this.displayMessage(this.options.message);
            }
        },
        // Displays the message
        displayMessage: function() {
            this.element.append("your div's and messages");
        },
        // Allows constructor/setter arguments
        _setOption: function( key ) {
            $.Widget.prototype._setOption.apply( this, arguments );
        }
    });
}(jQuery));

---

除非您希望接受css选择器或id作为参数，否则还有一种替代方法可以创建jQuery小部件。这样，您可以像这样使用它：

$("#msgArea").messageWidget("displayMessage");

甚至多次重复使用

$("#msgArea").messageWidget("displayMessage", "message to display");

示例样板小部件：

(function( $ ) {
    $.widget("ui.messageWidget", {
        // default options
        options: { message: undefined},
        // constructor
        _create: function() {
            if (this.options.message !== undefined) {
                this.displayMessage(this.options.message);
            }
        },
        // Displays the message
        displayMessage: function() {
            this.element.append("your div's and messages");
        },
        // Allows constructor/setter arguments
        _setOption: function( key ) {
            $.Widget.prototype._setOption.apply( this, arguments );
        }
    });
}(jQuery));

---

通常有两种方法，一种是，正如卡萨布兰卡所指出的，在DOM中提供一个div来附加消息。第二，我认为您需要的是在DOM本身上创建一个div节点。这样你就有了完全的控制权。毕竟，当你完成后，它会逐渐消失。也可以从dom中杀死它。这就是fancylightbox（我相信还有许多其他人）对DOM的作用。您可能希望将其放置在正文的开头，这样就没有其他包含元素，并根据您的意愿对其进行样式设置—很可能使其像一个lightbox/对话框一样漂浮在页面中间的某个位置。

通常有两种方法，一种是，正如卡萨布兰卡所指出的，在DOM中提供一个div来附加消息。第二，我认为您需要的是在DOM本身上创建一个div节点。这样你就有了完全的控制权。毕竟，当你完成后，它会逐渐消失。也可以从dom中杀死它。这就是fancylightbox（我相信还有许多其他人）对DOM的作用。您希望将其放置在主体的开头，这样就没有其他包含元素，并根据您的意愿对其进行样式设置-可能会使其漂浮在页面中部附近的某个位置，如一个灯箱/对话框。

您的意思是要根据实际脚本代码的编写位置确定上下文？类似这样的内容？：@Caspar-是的。我认为这是不可能的，但我想如果有人知道的话，那一定是SO的好人。所以，我决定问。@jake33-不。我不是在寻找相对于屏幕的位置。见@Caspar的问题。这就清楚了。有一种方法可以做到……我发布了一个答案。你是说你想根据实际脚本代码的编写位置来确定上下文？类似这样的事情？：@Caspar-是的。我认为这是不可能的，但我想如果有人知道的话，那一定是SO的好人。所以，我决定问。@jake33-不。我不是在寻找相对于屏幕的位置。见@Caspar的问题。这就澄清了。有一种方法可以做到……我贴了一个答案。