当前位置: 首页 > 面试题库 >

简单的jQuery ajax示例未在返回的HTML中找到元素

姬坚成
2023-03-14
问题内容

我正在尝试学习jQuery的ajax函数。我已经工作了,但是jQuery在返回的HTML DOM中找不到元素。在与jquery相同的文件夹中,运行以下页面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
    <title>runthis</title>

    <script type="text/javascript" language="javascript" src="jquery-1.3.2.min.js"></script>

    <script tyle="text/javascript">
    $(document).ready(function(){
        $('input').click(function(){
            $.ajax({
                type : "GET",
                url : 'ajaxtest-load.html',
                dataType : "html",
                success: function(data) {

                alert( data ); // shows whole dom

                alert( $(data).find('#wrapper').html() ); // returns null

                },
                error : function() {
                    alert("Sorry, The requested property could not be found.");
                }
            });
        });
    });
    </script

</head>
<body>
    <input type="button" value="load" />
</body>
</html>

哪个加载页面“ ajaxtest-load.html”:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
    <title>load this</title>

</head>
<body>
    <div id="wrapper">
    test
    </div>
</body>
</html>

它给出两个警报。一个显示DOM已加载,但第二个显示NULL而不是#wrapper。我究竟做错了什么?

编辑:我正在加载“ ajaxtest-load.html”,其中包括整个标头,包括jquery。那是问题吗?


问题答案:

通过使用,我已经设法从完整的html文档中加载了摘要.load()

要创建一个将html提取到DOM中的新块,请执行以下操作:

$('<div></div>').appendTo('body').load('some-other-document.html div#contents');

如果对您不起作用,请确保您使用的是jQuery的最新版本(或1.2版)。有关更多示例,请参见.load文档。

编辑:

但是请注意,使用上面的示例,结果将是:

<div><div id="contents">...</div></div>

要仅获取其他文档中#contents div的内容,请在load-function调用中使用回调函数。

$('<div></div>').load('some-other-document.html div#contents', null, 
    function (responseText, textStatus, XMLHttpRequest) {
        if (textStatus == success) {
            $('<div></div>').appendTo('body').html($(this).html());
        }
    }
);


 类似资料:
  • 我正在学习这个教程,它试图通过构建一个最小的JVM来最小化JVM内存占用。

  • 问题内容: 任何人都可以给我一个简单的nodeJs回调示例,我已经在许多网站上进行了搜索,但无法正确理解,请给我一个简单的示例。 我想做这样的事情… 问题答案: 现在打开节点或浏览器控制台,并粘贴以上定义。 最后在下一行中使用它: 关于节点样式错误约定 Costa问如果我们要遵守节点错误回调约定,会是什么样子。 按照这种约定,回调应期望至少收到一个参数(第一个参数)作为错误。根据上下文,我们可以选

  • 我有一个xamarin应用程序,可以从webAPI中提取数据。我多次检查api地址,我确信它是正确的。当我调试代码时,服务器上出现404 not found错误。然而,当我将URL复制并粘贴到浏览器时,我得到了预期的结果。我不明白为什么我的应用程序返回404。 我的方法: 我的桥接方法到HttpClient的PostAsync方法: 代币:正确 API URL:正确(我从调试输出中检查“/”符号。

  • 如果我有一个Kotlin函数 我想从Java调用,我必须这样做: 看起来很难看。为什么我不能像

  • 现在我们将前面的一些示例程序的代码坼开来分析一下. 下面的例子出现在简单的例子一节. def fact(n) if n == 0 1 else n * fact(n-1) end end print fact(ARGV[0].to_i), "\n" 因为是第一次解释,我们将逐行分析. def fact(n) 第一行,d

  • 问题内容: 是否有可能为集合中未找到的所有键返回默认值? 问题答案: [更新] 正如其他答案和评论者所指出的那样,从Java 8开始,您可以简单地调用。 [原版的] 没有Map实现可以完全做到这一点,但是通过扩展HashMap来实现自己的实现很简单: