Javascript 动态页面/用扭曲替换内容（wordpress）_Javascript_Html_Wordpress_Dynamic_Pageload

Javascript 动态页面/用扭曲替换内容（wordpress）

javascript html wordpress dynamic

Javascript 动态页面/用扭曲替换内容（wordpress）,javascript,html,wordpress,dynamic,pageload,Javascript,Html,Wordpress,Dynamic,Pageload,我想知道通过使用JQuery动态替换wordpress站点中的内容有多难。这是我要发表的文章：我的基本想法是将javascript文件中引用的元素更改为默认情况下在wordpress中创建的元素。这意味着将页面包装更改为包装，将主要内容更改为主要内容，将guts更改为内容不过，当我试图更换“勇气”时，我遇到了减速带。由于某些原因，页面不再显示内容。不管怎么说，在我解决了这个问题之后，我想出来了。我将把代码插入我的wordpress网站，希望一切顺利其中一页： <body&g

我想知道通过使用JQuery动态替换wordpress站点中的内容有多难。这是我要发表的文章：

我的基本想法是将javascript文件中引用的元素更改为默认情况下在wordpress中创建的元素。这意味着将页面包装更改为包装，将主要内容更改为主要内容，将guts更改为内容

不过，当我试图更换“勇气”时，我遇到了减速带。由于某些原因，页面不再显示内容。不管怎么说，在我解决了这个问题之后，

我想出来了。我将把代码插入我的wordpress网站，希望一切顺利

其中一页：

<body>
    <div id="wrapper">
        <header></header>
              <div class="nav">
              <ul class="sf-menu">
                  <li><a href="index.html">Home</a></li>
                  <li><a href="about.html">About</a></li>
                  <li><a href="contact.html">Contact</a></li>
              </ul>
          </div>
        </header>
        <section id="main-col">
            <div id="content">
            <h2>Home</h2>
            <p></p> 
            <p></p> 
            </div>
        </section>
    </div>
</body>
</html>

家

插入到标头中的Javascript：

/*
 * jQuery hashchange event - v1.2 - 2/11/2010
 * http://benalman.com/projects/jquery-hashchange-plugin/
 * 
 * Copyright (c) 2010 "Cowboy" Ben Alman
 * Dual licensed under the MIT and GPL licenses.
 * http://benalman.com/about/license/
 */
(function($,i,b){var j,k=$.event.special,c="location",d="hashchange",l="href",f=$.browser,g=document.documentMode,h=f.msie&&(g===b||g<8),e="on"+d in i&&!h;function a(m){m=m||i[c][l];return m.replace(/^[^#]*#?(.*)$/,"$1")}$[d+"Delay"]=100;k[d]=$.extend(k[d],{setup:function(){if(e){return false}$(j.start)},teardown:function(){if(e){return false}$(j.stop)}});j=(function(){var m={},r,n,o,q;function p(){o=q=function(s){return s};if(h){n=$('<iframe src="javascript:0"/>').hide().insertAfter("body")[0].contentWindow;q=function(){return a(n.document[c][l])};o=function(u,s){if(u!==s){var t=n.document;t.open().close();t[c].hash="#"+u}};o(a())}}m.start=function(){if(r){return}var t=a();o||p();(function s(){var v=a(),u=q(t);if(v!==t){o(t=v,u);$(i).trigger(d)}else{if(u!==t){i[c][l]=i[c][l].replace(/#.*/,"")+"#"+u}}r=setTimeout(s,$[d+"Delay"])})()};m.stop=function(){if(!n){r&&clearTimeout(r);r=0}};return m})()})(jQuery,this);

$(function() {

    var newHash      = "",
        $mainContent = $("#main-col"),
        $pageWrap    = $("#wrapper"),
        baseHeight   = 0,
        $el;

    $pageWrap.height($pageWrap.height());
    baseHeight = $pageWrap.height() - $mainContent.height();

    $("sf-menu").delegate("a", "click", function() {
        window.location.hash = $(this).attr("href");
        return false;
    });

    $(window).bind('hashchange', function(){

        newHash = window.location.hash.substring(1);

        if (newHash) {
            $mainContent
                .find("content")
                .fadeOut(200, function() {
                    $mainContent.hide().load(newHash + "#content", function() {
                        $mainContent.fadeIn(200, function() {
                            $pageWrap.animate({
                                height: baseHeight + $mainContent.height() + "px"
                            });
                        });
                        $("sf-menu a").removeClass("current");
                        $("sf-menu a[href="+newHash+"]").addClass("current");
                    });
                });
        };

    });

    $(window).trigger('hashchange');

});

/*
*jQuery hashchange事件-v1.2-2/11/2010
* http://benalman.com/projects/jquery-hashchange-plugin/
* 
*版权所有（c）2010“牛仔”本·阿尔曼
*MIT和GPL许可下的双重许可。
* http://benalman.com/about/license/
*/
（function（$，i，b）{var j，k=$.event.special，c=“location”，d=“hashchange”，l=“href”，f=$.browser，g=document.documentMode，h=f.msie&（g==b | | g将名称也更改为css ID。）这是唯一的原因。如果您在js和php/html中更改了ID，但在css中没有更改，它将不会显示任何内容
因此，将#page wrap改为#wrapper，将#main content改为#main col，这样就完成了
因此，总体而言，您需要修改3个文件
Js、HTML/PHP和CSS
如果你知道你在做什么，那就不难了。试着发布一些实际的代码或链接到你的测试版网站。好的，我添加了一些代码。好的，我让页面加载与一个普通的HTML文档一起工作。我应该如何在wordpress上进行测试？我知道我做错了什么。你知道我应该如何在wordpress中进行测试吗？我刚刚在我的新wordpress主题中添加了两天前的相同代码。你可以让它以相同的结构工作。如果你想要精确的代码，请提供代码。如果你能在这里提供你的代码结构，那么你可以更好地理解并帮助你工作。注意：我说的是你的php/loop/page代码，无论你想在哪里使用它。我不是com完全肯定。我的主题会在标题中插入代码，但当我在url中添加一个#而不是删除内容时，它只会重定向到主页。还有一件事：我不确定我使用的ID。对于nav，有多个标签让我感到困惑。首先是“nav”，然后在nav内部有“col control”，这是“sf menu”，即ul拥有所有链接。