Disons que j'ai cette sortie HTML: Comment utiliserais un script simple pour remplacer la virgule et l'espace à l'intérieur de chaque classe "blog-post-link" avec une ligne Pause? Donc, au lieu de ressembler à ceci: Mise à jour Remarque: les noms et le MD dans l'exemple simple ci-dessus ne doivent pas être codés en dur. Désolé je n'ai pas mentionné qu'à l'origine. Enfin, si je voulais ajouter un style au texte divisé de sorte que les lignes "MD" ci-dessus apparaissent sous une couleur différente, je me demande Si je pouvais utiliser la même fonction et simplement utiliser un
John Doe, MD
Jane Doe, MD
Jane Doe Smith, MD
de
La sortie serait:
John Doe
MD
Jane DOE
MD
Jane Doe Smith
MD
ou étiquette pour envelopper le texte divisé plutôt que juste une pause à la ligne. Toute aide est très appréciée, car je n'ai pas accès à la modification du texte original.
1 commentaires
6 Réponses :
Utilisez string.split avec, comme délimiteur, puis bouclez la matrice de sortie de chaque chaîne sur une nouvelle ligne.
let string = document.getElementById("myID").innerHTML;
let array = string.split(',');
let outStr = '';
array.foreach( (str) => {
outStr += str + '\n';
});
document.getElementById("myID").innerHTML = outStr;
Il existe de nombreuses autres façons de sélectionner des éléments que getElementyid . Considérant qu'il n'y ait aucun identifiant dans le HTML de l'OP, cela pourrait ne pas être la meilleure réponse.
<h3 class="blog-post-title"> <a href="https://www.link1.com" class="blog-post-title-link">John Doe, MD</a> </h3> <h3 class="blog-post-title"> <a href="https://www.link2.com" class="blog-post-title-link">Jane Doe, MD</a> </h3> <h3 class="blog-post-title"> <a href="https://www.link3.com" class="blog-post-title-link">Jane Doe Smith, MD</a> </h3>
Vous iriez itérale à travers les liens dans la rubrique. Divisez le texte à la virgule, puis mettez-les à nouveau ensemble mais enveloppez le deuxième élément en une portée. Ensuite, vous pouvez utiliser CSS pour styler la portée.
p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <h3 class="blog-post-title"> <a href="https://www.link1.com" class="blog-post-title-link">John Doe, MD</a> </h3> <h3 class="blog-post-title"> <a href="https://www.link2.com" class="blog-post-title-link">Jane Doe, MD</a> </h3> <h3 class="blog-post-title"> <a href="https://www.link3.com" class="blog-post-title-link">Jane Doe Smith, MD</a> </h3>
Cela met plus que simplement le "MD" dans la balise (code>. Je devrais supposer que le navigateur vous aide à supposer que la balise a a est fermée.
La balise SPAN est fermée et elle est à l'intérieur de la balise. Le seul "plus que juste que juste md" s'éloigne est un espace. Qui peut être coupé.
Votre code dit que txt [1] == "MD ", que vous incluez à l'intérieur de la balise (code>. Vous ne divisez pas la balise a .
Non ça ne le fait pas. Il vous manque le sélecteur qui comprend 'a'. Ce qui signifie qu'il ne sélectionne que le "texte" (non html) à l'intérieur de la balise A.
Ce requête Toutes les questions Pour obtenir une couleur différente, vous pouvez styles p> blog-post-title-link CODE> classes, remplacement des virgules dans leur HTML avec son texte suivant, enveloppé dans un div code>: un div code> comme ceci: p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h3 class="blog-post-title">
<a href="https://www.link1.com" class="blog-post-title-link">John Doe, MD</a>
</h3>
<h3 class="blog-post-title">
<a href="https://www.link2.com" class="blog-post-title-link">Jane Doe, MD</a>
</h3>
<h3 class="blog-post-title">
<a href="https://www.link3.com" class="blog-post-title-link">Jane Doe Smith, MD</a>
</h3>
C'est définitivement la réponse, bien que je me demande si je peux cibler la classe "Blog-post-Title-link" au lieu de "H3 A"
Merci Rick, très utile.
Voici comment puis-je diviser les lignes.
Un simple "remplacer" devrait faire ce travail.
Vous avez des md de codage rigoureux à cet endroit en supposant que ce sera toujours md?
@Nawedkhan, c'est ce que l'exemple montre. S'ils veulent autre chose, ils auraient dû expliquer explicitement le "MD" pourrait être n'importe quoi. Yagni.
Si tel est le cas, pourquoi pas le Code Hard Le John Doe aussi? Basé sur votre logique si le nom pourrait être Mary Smith, alors ils devraient avoir explicitement mentionner. MDR
@Nawedkhan, mon code n'a pas besoin de spécifier "John Doe". Ajouter cela est inutile. Étant donné que l'OP spécifiquement indiqué, ils voulaient modifier la partie "MD", c'est-à-dire nécessaire.
Je mettrais les deux dans une étiquette
distincte, donc son niveau de blocage. Ensuite, ajustez la hauteur de la ligne.