如何删除标题行中的类？

Question

我在 Wordpress 环境中。我需要隐藏标题的“中间”和“底部”行，所以我给所有行一个“隐藏”类，但这就是问题所在：我需要从“顶部”中删除“隐藏”类行 所以，使用 CSS，我可以使用“隐藏”类仅隐藏“中间”和“底部”行。如何从“顶”行中删除“隐藏”类？这是我为添加类“隐藏”所做的修改 (builder_header_renderer.php)：    $result = '<div class="hide" ' . blocksy_attr_to_html($row_container_attr) . '>';    $result .= '<div ' . blocksy_attr_to_html(array_merge([        'class' => $container_class    ])) . '>';

Answer 1

如果您想严格使用 JS 执行此操作，则可以在子主题的 script.js 文件中使用以下内容：

if(document.body.classList.contains('blog')){

    Array.from(document.querySelectorAll('header#header>div')).forEach((item, index) => {

        if(index > 0){

            item.classList.add('hide');

        }

    });

}

在您的子主题的 functions.php 文件中，您可以添加它以将您的 script.js 包含在您的主题中。

function mytheme_child_enqueue_scripts () {

    wp_enqueue_script('script-js', get_stylesheet_directory_uri().'/script.js', '', null, true);

}

add_action('wp_enqueue_scripts', 'mytheme_child_enqueue_scripts');

如果您使用 JavaScript 执行此操作，请确保满足以下三个先决条件：

1. 不要.hide在 PHP 中添加类。

2. 如果未在 PHP 中添加，请验证正确的标题项是否已.hide通过script.js.

3. 使用在 CSS 中定位它header#header .hide { display: none; }

如果 JS 不是实现此目标的严格要求，尽管要使其适应您对博客页面的要求，请使用它来实现您想要做的事情:

body.blog #header [data-row=middle],

body.blog #header [data-row=bottom] {

    display:none

}