使这个jQuery代码更具动态性

时间:2015-08-16 18:16:53

标签: jquery

jQuery(document).ready(function ($) {

    if (window.location.href.indexOf("seniors") > -1) {
        var $ul_senior = $('<ul class="sub-menu-jquery"></ul>');
        $("#menu-item-630").append($ul_senior);
        $("#menu-carecenter-seniors-menu li").each(function () {
            var $li = $(this);
            $($li).clone().appendTo(".sub-menu-jquery");
        });
    };
    if (window.location.href.indexOf("medical") > -1) {
        var $ul_medical = $('<ul class="sub-menu-jquery"></ul>');
        $("#menu-item-636").append($ul_medical);
        $("#menu-carecenter-medical-menu li").each(function () {
            var $li = $(this);
            $($li).clone().appendTo(".sub-menu-jquery");
        });
    };
    if (window.location.href.indexOf("foundation") > -1) {
        var $ul_foundation = $('<ul class="sub-menu-jquery"></ul>');
        $("#menu-item-635").append($ul_foundation);
        $("#menu-carecenter-foundation-menu li").each(function () {
            var $li = $(this);
            $($li).clone().appendTo(".sub-menu-jquery");
        });
    };
});

这段代码的作用是从Wordpress网站的侧边栏中克隆链接,并根据您所在网站的哪个部分将它们添加到主导航。

我对这段代码的了解越多,我就越能意识到通过从侧边栏中提取“老年人”或“医疗”或“基础”#id,并将其添加到基于主导航的内容,可以使其更具动态性标签的标题(也可以是'老年人'或'医疗'或'基础'。

这样,我就不需要使用特定的#menu-item-xxx,它将是完全动态的。

非常确定需要使用html()函数。但不确定如何。

2 个答案:

答案 0 :(得分:1)

你可能只是将Javascript的公共区域提取到一个函数中。也许是这样的?

addMenuItem("seniors", "630");
addMenuItem("medical", "636");
addMenuItem("foundation", "635");

function addMenuItem(location, item) {
if (window.location.href.indexOf(location) > -1) {
    var $ul = $('<ul class="sub-menu-jquery"></ul>');
    $("#menu-item-" + item).append($ul);
    $("#menu-carecenter-" + location + "-menu li").each(function() {
        var $li = $(this);
        $($li).clone().appendTo(".sub-menu-jquery");
    });
};

答案 1 :(得分:0)

使用数组可以让它变得更好。

jQuery(document).ready(function ($) {
    arrayHref = ['seniors', 'medical', 'foundation'];
    arrayID = ['menu-item-630', 'menu-item-636', 'menu-item-635'];
    $.each(arrayHref, function (index, value)) {
        if (window.location.href.indexOf(value)) {
            var $ul = $('<ul class="sub-menu-jquery"></ul>');
            $('#' + arrayID[index]).append($ul);
            $("#menu-carecenter-" + value + "-menu li").each(function () {
                var $li = $(this);
                $($li).clone().appendTo(".sub-menu-jquery");
            });
        }
    });
});