Utilisez JS pour générer un répertoire de blog et CSS pour personnaliser le blog

L'exemple de cet article présente la méthode d'utilisation de JS pour générer un répertoire de blog et CSS pour personnaliser le blog. Il est partagé avec tout le monde pour votre référence.

Si vous le souhaitez. pour générer un répertoire, beaucoup de gens disent que vous avez besoin de JS pour modifier les autorisations. Il suffit d'aller directement sur la page des paramètres, de trouver l'e-mail de contact ci-dessous et de l'envoyer directement. Le personnel vous répondra très rapidement.

Après avoir obtenu l'autorisation, ce qui suit consiste à placer le code JS compilé (recherché) écrit (recherché) dans la case du code HTML du pied de page, puis à cliquer sur Enregistrer. Il est important de faire attention aux niveaux de titres générés par la table des matières. Le code JS est le suivant, fondamentalement inchangé : il copie la méthode d'écriture de l'auteur original et peut générer des répertoires secondaires, h2 et h3 respectivement.

En résumé, cet annuaire présente les caractéristiques suivantes, que l'on peut également voir dans cet article (l'annuaire secondaire n'est pas utilisé dans cet article de blog).

1). Vous pouvez générer des répertoires à deux niveaux au début de l'article de blog
2). Il y a un lien vers le haut au-dessus de chaque répertoire de premier niveau

Le code JS est le suivant.

0)
 {
  var content = '';
  content += '';
  content += '目录';
  content += '';
  for(var i=0; i回到顶部';
   $(h2_list[i]).before(go_to_top);
   
   var h3_list = $(h2_list[i]).nextAll("h3");
   var li3_content = '';
   for(var j=0; j';
    $(h3_list[j]).before(li3_anchor);
    li3_content += '' + $(h3_list[j]).text() + '';
   }
   
   var li2_content = '';
   if(li3_content.length > 0)
    li2_content = '' + $(h2_list[i]).text() + '' + li3_content + '';
   else
    li2_content = '' + $(h2_list[i]).text() + '';
   content += li2_content;
  }
if($('#cnblogs_post_body').length != 0 )
  {
   $($('#cnblogs_post_body')[0]).prepend(content);
  }
 } 
}
GenerateContentList();
" _ue_custom_node_="true">

【Tutoriels associés recommandés】

1 Tutoriel vidéo JavaScript
2. Manuel en ligne JavaScript3.
Tutoriel bootstrap