javascript - jQuery - 可以使用内容加载器的一些帮助

Question

在 JavaScript 方面，我不是很精通，尤其是语法。所以我正在努力学习。在这个过程中，我试图实现一个内容加载器，它基本上从一个 div 中删除所有内容，并从不同文档的另一个 div 中插入内容。

我已经尝试在这个网站上这样做: www.matkalenderen.no - 检查那里的屁股丑陋链接。看看会发生什么？

我从这个网站上拿了这个例子: http://nettuts.s3.cdn.plus.org/011_jQuerySite/sample/index.html#index

但我不确定这个例子是否真的像我想的那样工作。我的意思是，如果代码只是删除一个 div 中的现有内容并插入另一个 div 中的内容，为什么此示例中的其他网页包含 doctype 和标题等？难道你不需要 div 和它的内容吗？没有“周围”的所有其他东西？也许我不明白这是如何工作的。认为它的工作原理与 include 非常相似。

但是这是我的代码:

$(document).ready(function() {

    var hash = window.location.hash.substr(1);
    var href = $('#dynloader a').each(function(){
            var href = $(this).attr('href');
            if(hash==href.substr(0,href.length-5)){
                    var toLoad = hash+'.html #container';
                    $('#container').load(toLoad)
            }                                                                                        
    });

    $('#dynloader a').click(function(){

            var toLoad = $(this).attr('href')+' #container';
            $('#container').hide('fast',loadcontainer);
            $('#load').remove();
            $('#wrapper').append('<span id="load">LOADING...</span>');
            $('#load').fadeIn('normal');
            window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
            function loadcontainer() {
                    $('#container').load(toLoad,'',showNewcontainer())
            }
            function showNewcontainer() {
                    $('#container').show('normal',hideLoader());
            }
            function hideLoader() {
                    $('#load').fadeOut('normal');
            }
            return false;

    });

});

Answer 1

jQuery .load() 有一些额外的功能来支持这个。
You can see it in the docs here (look at `Loading Page Fragments')

在您的示例中，这是重要的部分:hash+'.html #container' #container 之前的空格意味着 jQuery 将获取该 URL，查找元素使用 id="container" 并仅获取该元素的内容丢弃页面的其余部分。这让 .load() 以更通用的方式工作，而无需专门为 ajax 加载而设计的内容。

在你的情况下，我认为你只需要从末尾删除 #content 除非你正在寻找那个元素。这并不是说“查找内容”，这只是他们用于他们想要查找的元素的 ID。它可能是 #divToLoad，这将是一个更清晰的 IMO 示例。