How to make a regex to treat the text this way?

Asked

Viewed 127 times

1

Whereas I have random classes, may or may not have a class in the paragraph. I need to put an empty paragraph, when there is not an empty paragraph on top of the text. I can receive texts in these three formats, and the only one that should receive an extra paragraph is the text 3, because he doesn’t have an empty paragraph on top.

Obs: (with or without style and class), the problem happens because of this.

text 1:

<p  class="blablabla" style="" ></p>
<p>Nono nonono nonononono </p>

text 2:

<p  class="blobloblo">&nbsp;</p>
<p>Nono nonono nonononono </p>

text 3:

<p  class="blublublu" style="" ><span>nono nonono no</span></p>
<p>Nono nonono nonononono </p>

Here’s the method I have, only there’s a problem, it’s not just taking the first paragraph, so I don’t know what to do for it match first paragraph only:

$scope.trustAsHtml = function(string) {    
    var result = $sce.trustAsHtml(string);
    if (angular.isDefined(result)) {   
        result = result.replace(/\n/gim, '');
        if (!result.match(/^<p(.*)?>(\s|&nbsp;)<\/p>/gim)) {
            result = '<p class="paragraph-added"></p>' + result;
        }
        return result;
    }
}; 
  • I did not understand the reason of the negative... it is quite clear what I need. For anyone to understand.

  • This question I also did not understand the negative, but in the other maybe negatived because it is below google. And the worst that I will go through the same situation you, in the other question, because I intend to use the webview to display my hosted content and now I learned that google will block me because of their new policy.

  • My case is that there are two companies that have united becoming one, so we have to join two different architectures in the same app, in the other question that I was negative.

  • 2

    "Put two architectures together in the same app": Okay, it really does blow your mind, but it usually does this by creating a layer of data-saving abstraction, so it chews the data into a useful, standardized data model for the app

  • Instead of using regex DOMParser with var el = domparsed.getElementsByTag('p'); and check if there is the first paragraph el[0] is empty with el[0].textContent.trim() == '', would already be much simpler, so if there is not enough a var novo = document.createElement('p'); p.innerHTML = '&nbsp;'; domparsed.insertBefore(novo, domparsed.firstChild);

  • @Guilhermenascimento, I’ll try to use this... and I’ll answer you if it works. Thanks for the tip.

  • @Ivanferrer edited the comment with some more relevant code

  • Today I get one json with HTML... in string format, so I need to do this before it leaves for the ng-bind-html="saida", how could I make it a DOM object, before it exits and is rendered in the view? I would have to create an element?

  • like this?var el = document.createElement('div');&#xA; el.setAttribute('id', 'content_text_materia');&#xA; el.innerHTML = result;

  • But wasn’t it just add the paragraph when it didn’t exist? I’ll try rereading the question to see if I understand your need better.

  • I think it worked, man, thanks!

Show 6 more comments

1 answer

2


At @Guilhermenascimento’s suggestion, I arrived at a solution:

var el = document.createElement('div');
    el.innerHTML = result;

   var paragraphs = el.getElementsByTagName('p');
   if (paragraphs.length && paragraphs[0].innerHTML != '' && paragraphs[0].innerHTML != '&nbsp;') {
      var novo = document.createElement('p'); 
          novo.setAttribute('class', 'paragraph-added')
          novo.innerHTML = '&nbsp;'; 
          el.insertBefore(novo, el.firstChild);
    }
    result = el.innerHTML;
    return result;
  • Suggestion no if: if (paragraphs.length && !paragraphs[0].textContent.trim()) {, if you don’t need backward compatibility (old browsers like IE) String.prototype.trim

  • I can’t use textContent because there will be content with <span>..., but thanks for the tips, vc helped a lot. I always forget to think that working with DOM is much more practical and suitable.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.