Question

在我的Magento主题中通过local.xml在适当的位置呈现jQuery时遇到一些麻烦。

目前，我的layout.xml中的相关部分如下所示：

<!-- load jQuery from CDN with local fallback, latest version 1.11.0 -->
<block type="core/text" name="google.cdn.jquery">
    <action method="setText">
        <text><![CDATA[<script src="//code.jquery.com/jquery-1.11.0.min.js"></script><script>window.jQuery||document.write('<script src="js/jquery-1.11.0.min.js">\x3c/script>');</script><script>jQuery.noConflict();</script>]]></text>
    </action>
</block>

<!-- add global JS functions library -->
<action method="addItem"><type>skin_js</type><name>min/global-min.js</name></action>

然而，这里的global-min.js文件在 jQuery之前呈现，它（以及其他添加的核心/文本类型块）位于我的其他皮肤JS文件之后。

有没有办法根据我网站头部的输出优先级移动CDN加载的jQuery文件？

非常感谢你的帮助。

Answer 1

尝试使用xml文件中的以下代码

<layout>
    <default>
        <!--Root/Default Layouts-->
        <!--CSS and JS Files-->
        <reference name="head">
            <!--Add CSS and JS, skin Folder-->
         <!-- add global JS functions library -->
        <action method="addItem"><type>skin_js</type><name>min/global-min.js</name></action>
            <!-- Link to external JavaScript file (e.g Jquery CDN)  -->
            <block type="core/text" name="google.cdn.jquery">
                <action method="setText">
                    <text><![CDATA[<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>]]></text>
                </action>
            </block>
        </reference>
</default>
</layout>

您可以使用所需的版本替换jQuery来源。

由于magento最后加载了local.xml，所以提到的xml最后被合并了。这可能是您的加载订单无法正常工作的原因。

或者，您可以覆盖Mage_Page_Block_Html_Head::getCssJsHtml()方法并使用它。

此外，您可以尝试使用params元素，其中包含name属性，Magento将按升序排序：

<action method="addJs"><!-- this will be shown second -->
    <script>prototype/javascript1.js</script>
    <params><![CDATA[name="js002_second"]]></params>
</action>
<action method="addJs"><!-- this will be shown first -->
    <script>prototype/javascript2.js</script>
    <params><![CDATA[name="js001_first"]]></params>
</action>

Mage_Page_Block_Html_Head $_data;包含项目数组，因此我可以对其进行过滤，但默认方法不允许定义添加项目的顺序。

如果您正在使用core/text阻止，则可以使用before/after来定义加载顺序。例如：

    <layout>
<default>
    <reference name="head">
        <block type="core/text" name="google.cdn.jquery">
            <action method="setText">
                <text><![CDATA[<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><script type="text/javascript">jQuery.noConflict();</script>]]>
                </text>
            </action>
        </block>
        <block type="core/text" name="normalize.cdn.css">
            <action method="setText">
                <text><![CDATA[<link rel="stylesheet" href="http://css.cdn.tl/normalize.css">]]>
                </text>
            </action>
        </block>
        <block type="core/text" name="bootstrap.cdn.css">
            <action method="setText">
                <text><![CDATA[<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css">]]>
                </text>
            </action>
        </block>
        <block type="core/text" name="bootstrap.custom.css">
            <action method="setText">
                <text><![CDATA[<link rel="stylesheet" href="http://kokorugs.com/online-carpet-store/skin/frontend/kokorugs/default/css/bootstrap.css">]]>
                </text>
            </action>
        </block>
        <block type="core/text" name="layout.custom.css">
            <action method="setText">
                <text><![CDATA[<link rel="stylesheet" href="http://kokorugs.com/online-carpet-store/skin/frontend/kokorugs/default/css/layout.css">]]>
                </text>
            </action>
        </block>
        <block type="core/text" name="css.custom.css">
            <action method="setText">
                <text><![CDATA[<link rel="stylesheet" href="http://kokorugs.com/online-carpet-store/skin/frontend/kokorugs/default/css/styles.css">]]>
                </text>
            </action>
        </block>
        <block type="core/text" name="javascript.custom.js">
            <action method="setText">
                <text><![CDATA[<link rel="stylesheet" src="http://kokorugs.com/online-carpet-store/skin/frontend/kokorugs/default/js/script.js">]]>
                </text>
            </action>
        </block>
    </reference>
</default>
</layout>

希望它有所帮助。

控制Magento layout.xml中块的顺序 - 添加skinjs后出现jQuery CDN

1 个答案: