如何在 jquery 中从 xhtml 页面追加和添加数据

Question

我试图将多个 html/xhtml/xml 页面加载到一个网页中。这是我遵循的方法

这是我的基本页面

<html>
    <head>
          <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>    
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script type="text/javascript">



    var lastScrollTop = 0;
    var indexup = 4;
    var indexdown = 4;
$(window).scroll(function(event){
   var st = $(this).scrollTop();
   if (st > lastScrollTop){
        console.log($(window).scrollTop()+ " <><><>  " + $(window).height()+"  ===   "+$(document).height());
       // downscroll code
       var total = $(window).scrollTop()+$(window).height();
       var diff = Math.abs(total-$(document).height());

        if(diff<=2) {

     //  alert("bottom!");
       indexdown = indexdown+1;
       if(indexdown>7)
       {
           alert("This is the last page")
       }
       else
       {
       appendNext(indexdown);
        }
   }

   } else {
      // upscroll code
     if ($(window).scrollTop() == 0)
                {
                    console.log($(window).scrollTop() + $(window).height()+"  ===   "+$(document).height());
                   //  alert('Scrolled to Page Top');
                     indexup = indexup-1;
                     if(indexup==0)
                     {
                       alert('This is the first page');  
                     }
                     else
                     {
                       appendPrevious(indexup);  
                     }

                 }

   }
   lastScrollTop = st;
});        

                function appendNext(index)
                {
                $.get("html/01.PAGE."+index+".html", function (data) {
                    $("#appendToThis").append(data);
                });

                }

                function appendPrevious(index)
                {
                $.get("html/01.PAGE."+index+".html", function (data) {

                    var old_height = $(document).height();  //store document height before modifications
                    var old_scroll = $(window).scrollTop();
                    $("#appendToThis").prepend(data);
                    $(document).scrollTop(old_scroll + $(document).height() - old_height); //restore "scroll position"

                });

                }



        </script>
    </head>
    <body>
        <div id="loadDiv">

        </div>
        <script type="text/javascript">

$("#loadDiv").load("xhtml/01.PAGE.4.html");
            </script>
    </body>
</html>

正如预期的那样工作正常。我首先加载 01.PAGE.4.html，01.PAGE.5.html 附加在 loadDiv 之后，01.PAGE.3.html 附加在前面.

但实际上 01.PAGE.4.html 是 01.PAGE.4.xhtml.

我把扩展名从 xhtml 改成 html 进行测试，发现 jquery 可以加载 xhtml 代码，但它不能附加或前置相同的。

那是当我尝试将代码重新运行为 xhtml 时代码给了我这个错误

uncaught typeerror cannot read property 'ownerdocument' of null jquery 当检查控制台时，

我怀疑如何从 #Document

中获取值

当我注销时，它有整个页面数据，但我不知道如何附加或预先添加 jquery。但即使对于 jquery 的 xhtml 页面加载功能也是有效的。有人请帮忙

如何从 #Document 获取数据以进行 jquery 附加和前置？

Answer 1

$.get ("xhtml/01.PAGE.xhtml", function (data)
{
     $("#appendToThis").html($(data).children());
}, 'xml');

试试这个。请参阅 https://api.jquery.com/jquery.get/ 了解更多详情。

如何在 jquery 中从 xhtml 页面追加和添加数据

how to get data in jquery append and prepend from an xhtml page

html

javascript

xhtml

jquery