Add string after last text in jquery

Question

I'm trying to build a website using jquery-1.10.2 where I want to replace css related strings like <style>, <link> etc. with comment string .So far I've managed to replace them by  by regex since I'm noob about regex. Here are my codes,

$(document).ready(function () {
$('#btnUpdate').click(function () {
    $('#divText').val($('#divText').val().replace(/<\/?style.*?>|<\/?link.*?>/, "<!--"));
});

});

JSFiddle Demo

How can I add --> after the last string? Need this help badly. Thanks.

What's your expected output?

Avinash Raj
– Avinash Raj

2015-06-16 10:42:26 +00:00
Commented Jun 16, 2015 at 10:42 — Avinash Raj
– Avinash Raj, Commented Jun 16, 2015 at 10:42

Avinash Raj · Accepted Answer · 2015-06-16 10:43:37Z

2

Use capturing groups.

$('#divText').val($('#divText').val().replace(/(<\/?(?:style|link).*?>)/, "<!-- $1 -->"));

OR

$('#divText').val($('#divText').val().replace(/(<\/?(?:style|link)[^>]*>)/, "<!-- $1 -->"));

DEMO

edited Jun 16, 2015 at 10:43

answered Jun 16, 2015 at 10:38

Avinash Raj

175k32 gold badges247 silver badges289 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Bram Vanroy Over a year ago

You might want to add an optional ending space or / in case non-HTML 5 is used.

Arun P Johny · Accepted Answer · 2015-06-16 10:48:05Z

1

Not a fan of using regex to modify html content, so

$(document).ready(function() {
  $('#btnUpdate').click(function() {
    var $tmp = $('<div />', {
      html: $('#divText').val()
    });

    $tmp.find('link, style').replaceWith(function() {
      return document.createComment(this.outerHTML);
    });

    $('#divText').val($tmp.html());
  });
});

$(document).ready(function() {
  $('#btnUpdate').click(function() {
    var $tmp = $('<div />', {
      html: $('#divText').val()
    });

    $tmp.find('link, style').replaceWith(function() {
      return document.createComment(this.outerHTML);
    });

    $('#divText').val($tmp.html());
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<textarea id="divText" style="width: 400px; height: 300px;">
  something

  <link href="//abc.comd/ss.css" rel="stylesheet"/>

  <style>
    div: {color: red;}
  </style>

  <div>adf</div>
</textarea>
<br>
<button id="btnUpdate">Update</button>

edited Jun 16, 2015 at 10:48

answered Jun 16, 2015 at 10:42

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

1 Comment

Bram Vanroy Over a year ago

I thought the goal was to actually remove the tags, but apparently that's not the case. I didn't know about createComment, so that's nice. +1

David Chavez · Accepted Answer · 2015-06-16 10:42:44Z

0

Why dont you just try to remove those attributes with removeAttr?

$(document).ready(function () {
$('#btnUpdate').click(function () {
    $('#divText').val($('#divText').removeAttr("style");
});

answered Jun 16, 2015 at 10:42

David Chavez

6173 silver badges17 bronze badges

Collectives™ on Stack Overflow

Add string after last text in jquery

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related