我想将div和class添加到父[li]的[ul class=“sub menu”]之后的子[li]元素中。问题是，当我试图修改start\\el函数中的[li]时，所有[li]都会被修改，即使是在[ul class=“sub menu”]之外的那些，父级也会被修改。请帮助我分离[li]，这样我就只能在没有Javascript的情况下修改[ul class=“sub menu”]中的那些。
public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
if ( isset( $args->item_spacing ) && \'discard\' === $args->item_spacing ) {
$t = \'\';
$n = \'\';
} else {
$t = "\\t";
$n = "\\n";
}
$indent = ( $depth ) ? str_repeat( $t, $depth ) : \'\';
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$classes[] = \'menu-item-\' . $item->ID;
$class_names = join( \' \', apply_filters( \'nav_menu_css_class\', array_filter( $classes ), $item, $args, $depth ) );
$class_names = $class_names ? \' class="\' . esc_attr( $class_names ) . \'"\' : \'\';
$id = apply_filters( \'nav_menu_item_id\', \'menu-item-\'. $item->ID, $item, $args, $depth );
$id = $id ? \' id="\' . esc_attr( $id ) . \'"\' : \'\';
$output .= $indent . \'<li\' . $id . $class_names .\'>\';
$atts = array();
$atts[\'title\'] = ! empty( $item->attr_title ) ? $item->attr_title : \'\';
$atts[\'target\'] = ! empty( $item->target ) ? $item->target : \'\';
$atts[\'rel\'] = ! empty( $item->xfn ) ? $item->xfn : \'\';
$atts[\'href\'] = ! empty( $item->url ) ? $item->url : \'\';
$atts = apply_filters( \'nav_menu_link_attributes\', $atts, $item, $args, $depth );
$attributes = \'\';
foreach ( $atts as $attr => $value ) {
if ( ! empty( $value ) ) {
$value = ( \'href\' === $attr ) ? esc_url( $value ) : esc_attr( $value );
$attributes .= \' \' . $attr . \'="\' . $value . \'"\';
}
}
$title = apply_filters( \'the_title\', $item->title, $item->ID );
$title = apply_filters( \'nav_menu_item_title\', $title, $item, $args, $depth );
$item_output = $args->before;
$item_output .= \'<a\'. $attributes .\'>\';
$item_output .= $args->link_before . $title . $args->link_after;
$item_output .= \'</a>\';
$item_output .= $args->after;
$output .= apply_filters( \'walker_nav_menu_start_el\', $item_output, $item, $depth, $args );
}
SO网友:ngearing
您不需要制作一个全新的walker，只需使用一个过滤器和一些基于函数参数的条件即可。
我们需要的过滤器是walker_nav_menu_start_el 您可以在代码示例的底部看到。
为了确保只针对子页面，我们可以使用$depth 参数，请参见下面的示例。
function ngstyle_child_menu_items($item_output, $item, $depth, $args)
{
// Check we are on the right menu & right depth
if ($args->theme_location != \'primary\' || $depth !== 1) {
return $item_output;
}
$new_output = $item_output;
$new_output .= \'<div class="super-mega-awesome"></div>\'; // Add custom elems
return $new_output;
}
add_filter(\'walker_nav_menu_start_el\', \'ngstyle_child_menu_items\', 10, 4);
SO网友:Diogo
如果你想直接插入这些<div>基于某些条件或触发器，您将需要javascript（或jQuery或php）。无法摆脱脚本语言。
这个<li>来自此函数的´在以下变量中定义：
$output .= $indent . \'<li\' . $id . $class_names .\'>\';
因此，如果您要添加<div> 在它里面，您可以尝试以下操作：
$output .= $indent . \'<li\' . $id . $class_names .\'>\' . \'<div class="class-1 class-2">\';
但是，如果这些
<div>\'s应该始终存在，您可以在它来自的php文件中对其进行硬编码。
当涉及到仅将样式更改应用于那些特定的<li>如果你是通过CSS来实现的，那么它非常简单，你所要做的就是明确<li> 你想成为目标。
像这样：
ul.sub-menu li.the-li-class {
property: value;
}
例如，如果您使用jQuery进行操作，它将如下所示：
$(\'.sub-menu\').find(\'.li-class\');
$(this).css({\'property-1\' : \'value\', \'property-2\' : \'value\' });
对于jQuery，还有其他方法。这一切都是关于知道如何遍历DOM树，如果不熟悉的话，您可能想深入了解这一点。
