javascript - 在 Jquery/Ajax 导航 Wordpress 上更新 balise

Question

我正在为一个 wordpress 网站做一个 ajax 导航。我用淡入淡出更新了 #content，这没问题，但我想用我的新页面标题更新我的头部，我没有找到!

$(document).ready(function () {

    //hash change
    $(window).hashchange(function () {

        //on retrouve le vrai lien
        var arg = window.location.hash.substring(3);
        var link = 'http://ladresse.graphsynergie.com/' + arg;


        $.ajax({
            url: link,
            processData: true,
            dataType: 'html',
            success: function (data) {
                data = innerShiv(data, false);
                var contenu = $(data).find("#contenu");

                //problem part
                var head = $(data).find('head').text();
                document.head = head;
                //problem part end


                $('#contenu').fadeOut('200', function () {
                    $(this).html(contenu.html()).fadeIn('200');
                });
            }
        });
    });
    //end

    //détection d'un hash onload
    if (window.location.hash.substring(3) != '') {
        $(window).trigger('hashchange');
    }
});

Answer 1

考虑到 .text() 只会检索包含在 html 标签内的“文本”，查看 jQuery documentation.我认为你真正想要的是is to use the .html() method .

因此，我认为您可能希望将这两行有问题的代码替换为:

$("head").html($(data).find("head").html());

更新:

显然，所有浏览器在创建 DOM 对象时都会删除不在“主体”内的任何内容。问题是，当您执行以下操作时: "$(data)"jQuery 使用“data”变量的内容创建了一个 DOM 对象，并且您的浏览器决定忽略所有不在“body”标签内的元素，因此在jQuery 处理“head”元素的内部 DOM 对象不再存在。因此，您必须找到解决方法。

试试这个，将这些代码行放在“success: function (data) {”行之后:

var headIni = data.toLowerCase().indexOf("<head");
var headEnd = data.toLowerCase().indexOf("</head>");
headIni = data.indexOf(">", headIni + 1) + 1;
var headHTML = data.substring(headIni, headEnd);

然后，替换我最初为此建议的行:

$("head").html(headHTML);

这应该可以完成工作。我确信一定有更优雅的方法来做到这一点，但希望这对您来说足够好。

更新 2:

如果你关注this link你会找到一个更好的方法来做到这一点。只需添加您将在那里找到的库“jquery.ba-htmldoc.js”，然后执行此操作:

$("head").html($.htmlDoc(data).find('head').html());