javascript-記事タグ内の要素が10回複製され、すべてが同じクラス、IDなどを取得します
tl; dr; WordPressで実行される一部のJavaScriptは、HTML全体で私の最上位の要素を複製します。画像を参照してください。
こんにちは
ワードプレスのこのバグには本当に驚いています。実際、複製は非常に簡単です。欲しかった
<a class="something" href="a-link"> ... </a>
すべての記事のコンテンツを次のコードのようにラップするには:
<article id="post-<?php the_ID(); ?>" <?php post_class('col-md-4'); ?>>
<a class="hehe" href="google.com">
<?php
if (is_sticky() && is_home() && ! is_paged()) {
printf( '<span class="sticky-post">%s</span>', __('Featured', 'nisarg'));
} ?>
<?php nisarg_featured_image_disaplay(); ?>
<div class="main-image">
<?php if( get_field('main_image') ): ?>
<img class="img-responsive " src="<?php the_field('main_image'); ?>" />
<?php endif; ?>
</div>
<?php if( get_field('vacation_type_image') ): ?>
<img src="<?php the_field('vacation_type_image'); ?>" class="post-vacation-type" />
<?php endif; ?>
<header class="entry-header">
<div class="post-header">
<div class="row blog_post_container">
<div class="col-sm-12 blog_post_info_container_col">
<div class="blog_post_info_container">
<div class="blog_post_info_container_margin">
<span class="screen-reader-text"><?php the_title();?></span>
<?php if( is_single()) : ?>
<h1 class="entry-title blog_post_header"><?php the_title(); ?></h1>
<?php else : ?>
<h2 class="blog_post_info entry-title">
<?php the_title(); ?>
</h2>
<?php endif; // is_single() ?>
<?php if ('post' == get_post_type()) : ?>
<div class="entry-meta">
<h5 class="blog_post_info entry-date"><?php nisarg_posted_on(); ?></h5>
</div><!-- .entry-meta -->
<?php endif; ?>
</div>
</div>
</div>
</div>
</div>
</header><!-- .entry-header -->
<div class="entry-summary row">
<div class="excerpt">
<?php the_excerpt(); ?>
<div class="excerpt-footer">
<div class="facebook-button">
<div class="fb-like"
data-share="true"
data-width="500"
data-show-faces="true">
<a class="fb-xfbml-parse-ignore"
target="_blank"
href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&src=sdkpreparse">
</a>
</div>
</div>
</div>
</div>
</div><!-- .entry-summary -->
<!--<footer class="entry-footer">
<?php nisarg_entry_footer(); ?>
</footer> -->
</a>
</article><!-- #post-## -->
Nisargテーマを使用していますが、26のテーマの中に入ると、次のようになります。
<a class="something" href="a-link"> ... </a>
そのcontent.php内では同じ効果があり、記事内の要素が散らかっています。このように:
Webページのソースコードを見ると、これらの追加のA要素が表示されないため、JavaScriptが追加されています。いくつかのテーマで発生しているので、html5shivと関係があると思います...しかし、iveはそのスクリプトを方程式から削除しようとしましたが、問題は残っています。誰かがこのようなことをすることができるどのjavascriptライブラリを知っていますか?また、grepを使用して、a.cloneNodeを実行するが、優先されないjavascriptファイルを検索しました。
26、エラーの複製:
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<a href="http://www.google.com" class="hehe">
<header class="entry-header">
<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
<span class="sticky-post"><?php _e( 'Featured', 'twentysixteen' ); ?></span>
<?php endif; ?>
<?php the_title( sprintf( '<h2 class="entry-title"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
</header><!-- .entry-header -->
<?php twentysixteen_excerpt(); ?>
<?php twentysixteen_post_thumbnail(); ?>
<div class="entry-content">
<?php
/* translators: %s: Name of current post */
the_content( sprintf(
__( 'Continue reading<span class="screen-reader-text"> "%s"</span>', 'twentysixteen' ),
get_the_title()
) );
wp_link_pages( array(
'before' => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentysixteen' ) . '</span>',
'after' => '</div>',
'link_before' => '<span>',
'link_after' => '</span>',
'pagelink' => '<span class="screen-reader-text">' . __( 'Page', 'twentysixteen' ) . ' </span>%',
'separator' => '<span class="screen-reader-text">, </span>',
) );
?>
</div><!-- .entry-content -->
<footer class="entry-footer">
<?php twentysixteen_entry_meta(); ?>
<?php
edit_post_link(
sprintf(
/* translators: %s: Name of current post */
__( 'Edit<span class="screen-reader-text"> "%s"</span>', 'twentysixteen' ),
get_the_title()
),
'<span class="edit-link">',
'</span>'
);
?>
</footer><!-- .entry-footer -->
</a>
</article><!-- #post-## -->
結果のhtml:
つまり、content.phpのような記事タグの直後にタグを追加するだけで、すべてのdiv内にタグが複製されます。これは私には非常識に思えます。
ありがとう
編集1:まったく同じエラーで「コア」ワードプレステーマ26の例を追加します。
編集2:確認できます。Wordpressをクリーンインストールすると、この問題が発生します。
答え :
解決策:
<h2>
のタイトル内に別の<a>
があります。 <a>
タグをネストすることはできません。
これを行うと、ブラウザはネストされた <a>
を閉じる構造を修正しようとします。表示されるのは結果です。
同様の質問
私たちのウェブサイトで同様の質問で答えを見つけてください。