Detailed explanation of WeChat mini-app Rich Text to Text example code

This article mainly introduces detailed information about examples of conversion from small program Rich Text to Text. For more information about examples of conversion from small program rich text to text, see the next article, for more information, see

Applet-convert rich text to text

I am also engaged in this kind of hot mini-programs recently. I found a disgusting problem. The small program does not have components that support rich text content, and it is not appropriate to change the interface. Therefore, with this question, there is no technical record.

First, we can see that there is no rich text display in the format:

*. Wxml code. Content is rich text content

 
    
  
   {{content}}
    
 

Display result:

convertHtmlToText: function convertHtmlToText(inputText) {  var returnText = "" + inputText;  returnText = returnText.replace(/<\/p>/ig, '\r\n');  returnText = returnText.replace(/<\/li>/ig, '\r\n');  returnText = returnText.replace(/
/ig, ' * ');  returnText = returnText.replace(/<\/ul>/ig, '\r\n');  //-- remove BR tags and replace them with line break  returnText = returnText.replace(/
  
   /gi, "\r\n");  //-- remove P and A tags but preserve what's inside of them  returnText=returnText.replace(/
   
    /gi, "\r\n");  returnText=returnText.replace(/(.*?)<\/a>/gi, " $2 ($1)");  //-- remove all inside SCRIPT and STYLE tags  returnText=returnText.replace(/
    
     [\w\W]{1,}(.*?)[\w\W]{1,}<\/script>/gi, "");  returnText=returnText.replace(/
     
      [\w\W]{1,}(.*?)[\w\W]{1,}<\/style>/gi, "");  //-- remove all else  returnText=returnText.replace(/<(?:.|\s)*?>/g, "");  //-- get rid of more than 2 multiple line breaks:  returnText=returnText.replace(/(?:(?:\r\n|\r|\n)\s*){2,}/gim, "\r\n\r\n");  //-- get rid of more than 2 spaces:  returnText = returnText.replace(/ +(?= )/g,'');  //-- get rid of html-encoded characters:  returnText=returnText.replace(/ /gi," ");  returnText=returnText.replace(/&/gi,"&");  returnText=returnText.replace(/"/gi,'"');  returnText=returnText.replace(//gi,'>');  return returnText;}
     
    
   
  

Put the above code into any suitable small program js file, and then introduce the file in the js file that needs to process data. the following shows the call instructions in the app. js file.

Example:

Var app = getApp () // Get the app applet instance onLoad: function (options) {wx. request ({url: 'http: // example.com/api' + options. id + '. json', headers: {'content-type': 'application/json'}, success: function (res) {res. data. content = app. convertHtmlToText (res. data. content) that. setData ({art: res. data. content}) console. log (res. data )}})}

Then refresh the compilation, and you can see the result:

Here you can continue to adjust the css to make the display better.

Thank you for reading this article. I hope it will help you. thank you for your support for this site!

The above is a detailed explanation of the sample code of the small program Rich Text to Text. For more information, see other related articles in the first PHP community!