CODEWITHSUNDEEP
javascriptjquery
Exception
Exception

Reputation: 8389

Highlight the text which has bold, underline, Italic styles

How can I search for text which has any of below properties shown below. 

 .css('font-weight', 'bold');
 .css('font-style', 'italic');
 .css('text-decoration', 'underline');
 <b> Some Text </b>
 <u> Some Text </u>
 <i> Some Text </i>

I want to replace the text like this 

 var body = $('body');
 var replaced = body.html().replace(text,'<span class="hasStyle">'+text+'</span>'); 
 $('body').html(replaced);

Upvotes: 2

Views: 1499

Answers (3)

joshcomley
joshcomley

Reputation: 28838

Use the filter and wrap functions in jQuery. Here is a simple example:

$("*").filter(function(i, elm) {
    return $(elm).css("text-decoration").match(/underline/i);
}).wrap("<span class=\"highlight\" />");

http://jsfiddle.net/joshcomley/6RNQx/

This should give you a general idea of how to approach the problem, and you can easily extend the filter to your own criteria.

Upvotes: 2

Fatih Donmez
Fatih Donmez

Reputation: 4347

You can succeed it like this;

$(this).find("span").each(function(index, value){

    var fontstyle = $(this).css('font-style');
    if(fontstyle == "italic")
    {
        //Do it here                 
        alert("it's italic\n" + $(this).html());
    }
});

Upvotes: 0

Gfox
Gfox

Reputation: 307

1) First part of your block is for setting values.

2) please try this

var ccsStyle="font-weight:bold";
var elements = [];
$("*").each(function(){
  var st = $(this).attr("style");
  if(st.indexOf(cssStyle) > -1) elements.push(this);
});

// now elements array holds all you need to replace

Upvotes: 1

Related Questions