极限字符在div中显示而不会丢失格式

我发现了一个限制字符在div中的代码，但它不工作时，我的字符串格式化为HTML。极限字符在div中显示而不会丢失格式

var myDiv = $('.credits'); 
myDiv.text(myDiv.text().substring(0,162));

我想限制div中的字符，但不会丢失格式。我可以使用PHP，JavaScript或jQuery。

感谢您的帮助提前。 myDiv的

HTML结构：

<p>this is my test <b>hello</b> <i>world</i></p>

来源

2014-02-07 Vivek Modi

提供的 'myDiv' –

HTML结构假设你的 “格式化” 是指一个DOM树，那么你必须解析整个树来维护格式。现在看看这个页面或者任何页面，你或者其他人如何在不丢失格式的情况下修剪文本？如果没有人能做到，那么没人能回答这个问题。 – Johnny

这是myDiv的HTML结构：

这是我的测试hello world

–

试试这个

<body> 
<div id="test_div"> 
<h1>TITRE</h1> 
<p><strong>Texte en gras</strong><br /> 
<em>Texte en italique</em><i> texte avec balise i</i> <span>texte normale </span><strong> autre gras</strong></p> 
</div> 
<script> 
$(function(){ 
    var nb_limit=5 ,nb_all_charac=0,clean_all=false; 
    var fonc_clean_balise=function($v_element,maxi_chara){ 
     if($v_element.children().length) 
      $v_element.children().each(function(index, element) { 
       var $child=$(element); 
       fonc_clean_balise($child,maxi_chara); 
       maxi_chara=(maxi_chara-$child.text().length); 
       maxi_chara=(maxi_chara<0)?0:maxi_chara; 

      }); 
     else{ 
      $v_element.text($v_element.text().substring(0,maxi_chara)); 
     } 
    }; 
    $('#test_div').children().each(function(index, element) { 
     $element=$(element); 
     if(!clean_all){ 
      nb_all_charac+=$element.text().length; 
      if(nb_all_charac>nb_limit){ 
       clean_all=true; 
       var lower_limit=nb_limit-nb_all_charac; 
       nb_limit=(lower_limit<0)?nb_limit:lower_limit; 
       fonc_clean_balise($element,nb_limit); 
      } 
     }else{ 
      fonc_clean_balise($element,0); 
     } 
    }); 
}); 
</script> 
</body>

来源

2014-02-07 10:06:53

嗨，谢谢你的代码。它的伟大工程，但我的HTML是这样的：

这是我的测试你好世界

–

如果文本没有格式化，把它放在一个跨度例如：

这是我的测试打招呼世界

–

极限字符在div中显示而不会丢失格式

回答

相关问题