Principe de mise en œuvre de l'interception multiligne HTML au-delà du texte et production de pages code_HTML/Xhtml_Web

Le code pour intercepter plusieurs lignes de HTML au-delà du texte est le suivant :

HTML :

Copiez le code

Le code est le suivant :

www.jb51.net
< ;/p>

URL : http://www.jb51.net

CSS :

Copier le code

Le code est le suivant :

.sytm-text-1 {

couleur : #FFF

arrière-plan : #000 ;
largeur : 410px ;
hauteur : 22px ;
.sytm-text-2 {
couleur :
arrière-plan : #000 ; 🎜>largeur : 410px ;
hauteur : 44px ;
}
p {
hauteur de la ligne :
}


JS (présentation de jQuery );

Copier le code

Le code est le suivant : $("div[class *='sytm-text']").each(function (e){ var divHeight = $(this).height();

var $p = $("p", $(this) ).eq(0);

while ($p .outerHeight() > divHeight) {

$p.text($p.text().replace(/(s)*([a-zA -Z0-9] |W)(...)? $/, "..."));
}


Il peut être trouvé à partir de le code ci-dessus indique que le principe principal pour obtenir cet effet réside dans les sous-conteneurs (p). La comparaison avec la hauteur du conteneur parent (div) effectue une troncature de caractères basée sur des expressions régulières jusqu'à ce que les deux soient égaux. Ainsi, la clé pour contrôler le nombre de lignes interceptées est naturellement la hauteur du div.