发布新闻等信息时，必然会用到富文本编辑器。然而我们在前端页面展示的时候，可能需要把内容文字提取出来，作为简介使用；又或者把图片提取一张作为封面图片使用。
解决方案；

1 提取文本或者封面图片存入数据库中

(1)在前端处理文字传给后台

这里我使用的是kindeditor编辑器，方法如下：

var text = editor.text();

alert这个值会发现，图片没有被处理掉，所以用js手动再次处理，方法如下：

  function repalceHtml(str){
    str = str.replace(/<[^>]+>|&[^>]+;/g,"").trim();//去掉所有的html标签和&nbsp;之类的特殊符合
    return str;
    }
    text = repalceHtml(text);

把这个text传入后台即可。

(2)在Java端处理，前端不用处理

后台拿到内容之后，是一段html字符串，因此需要截取一下
截取文字方法如下：

	public static String getHtmlText(String strHtml) { 
		String txtcontent = strHtml.replaceAll("</?[^>]+>", ""); //剔出<html>的标签 
		txtcontent = txtcontent.replaceAll("<a>\\s*|\t|\r|\n|&nbsp;|</a>", "");//去除字符串中的空格,回车,换行符,制表符 
		return txtcontent; 
	}

截取图片src方法如下：

public static List<String> getImageSrc(String htmlStr) {
 List<String> pics = new ArrayList<String>();
       String img = "";
       String a = "";
       Pattern p_image;
       Matcher m_image;
       //String regEx_img = "<img.*src=(.*?)[^>]*?>"; //图片链接地址
       String regEx_img = "<img.*src\\s*=\\s*(.*?)[^>]*?>";
       p_image = Pattern.compile
               (regEx_img, Pattern.CASE_INSENSITIVE);
       m_image = p_image.matcher(htmlStr);
       while (m_image.find()) {
           // 得到<img />数据
           img = m_image.group();
           // 匹配<img>中的src数据
           Matcher m = Pattern.compile("src\\s*=\\s*\"?(.*?)(\"|>|\\s+)").matcher(img);
           while (m.find()) {
               pics.add(m.group(1));
           }
       }
 return pics;
}

调用方法：

if(!StringUtils.isEmpty(validationIndicators.getContents())){
	//处理图片
	List<String> list = GetSrcUtils.getImageSrc(validationIndicators.getContents());
	if(list!=null&&list.size()>0){
		validationIndicators.setImg(list.get(0));
	}
	//处理文字
	String text = GetHtmlTextUtils.getHtmlText(validationIndicators.getContents());
	validationIndicators.setZy(text);
}

2.展示页面的时候，直接在前端处理

前端拿到json字符串之后，遍历的时候，手动处理一下，依赖的依然是同一个js方法。

  function repalceHtml(str){
    str = str.replace(/<[^>]+>|&[^>]+;/g,"").trim();//去掉所有的html标签和&nbsp;之类的特殊符合
    return str;
    }
    text = repalceHtml(text);

更多推荐

获取富文本编辑器的纯文本内容