Question

我通过替换main标记内的内容，使用ajax加载我的网站页面。问题是，使用Wordpress，每个页面都有自己的body类，这些类对于样式目的很有用，所以我想用下一页的类替换旧页面的正文类。

我想我会运行一个新的ajax请求来获取整个html页面，然后检查body元素，然后使用.attr("class")获取类列表，最后替换旧的body类由新人...

但是类总是返回undefined而不是类列表。

编辑：我尝试使用.cd-main-content代替正文，奇怪的是它有效，我得到了这个元素的类。所以我现在假设问题不是来自我的语法，而是来自元素本身我怎么可能让它在body元素上工作？（我已尝试将.find替换为.filter，但它也无效。）

HTML结构

<body id="body" class="home page-id-number other-classes">
    <main>
        <div class="cd-main-content">
            <!-- inside is the dynamically loaded content-->
        </div>
    </main>
</body>

的jQuery

$.ajax({url: url, 
    success: function(data){
        var body = $(data).find("#body"); 
        var classes = body.attr("class");
        console.log(data); //returns the html as expected
        console.log("body : "+body); //returns [object Object]
        console.log("classes : "+classes); //returns undefined
    } 
});

Answer 1

您的jQuery代码错误：

$.ajax({url: url, 
    success: function(data){
        var body = $(data).find("body"); //not #body
        var classes = body.attr("class");
        console.log(data); //returns the html as expected
        console.log("body : "+body); //returns [object Object]
        console.log("classes : "+classes); //returns undefined
    } 
});

右侧选择器为body而非#body，这是一个ID选择器

因此，要更改您的身体类，请使用以下代码：

$.ajax({url: url, 
    success: function(data){
        var classes = $(data).find("body").attr("class"); //get the classes
        $("body").attr("class", classes); //set the classes
    } 
});

jQuery Selectors

Answer 2

＆＃34;主体＆＃34;从字符串获取时通过jQuery进行标记过滤。

所以$（data）[0]将支持所有内容，无需正文。

也使用过滤器，而不是＆＃34;找到＆＃34; 所以你可以得到这样的课程：

target_compile_definitions()

Answer 3

我找到了一个解决方案，它并不理想，但它解决了这个问题。

首先，我必须假设无法获取body元素的属性，因为它似乎是由jQuery过滤的。但是，可以获取子元素。

我最终将body类添加到body和main元素（在wordpress的header.php文件中）。

现在我的代码：

<强> HTML

<body id="body" class="home page-id-number other-classes">
    <main class="home page-id-number other-classes">
    <!-- if I had the possibility, I'd have added "data-body-class" instead of "class" -->
        <div class="cd-main-content">
            <!-- inside is the dynamically loaded content-->
        </div>
    </main>
</body>

<强>的jQuery

$.ajax({url: url, 
    success: function(data){
        var classes = $(data).filter("main").attr("class"); //get the classes 
        $("body, main").attr("class", classes); //set the classes 
    } 
});

jQuery - 如何从ajax请求中获取元素的类

3 个答案: