Tuesday, October 27, 2015

Manipulate HTML string using jQuery

Scenario

We have a HTML string which may or may not have tables. We need to make sure the width of all tables and table columns are empty.

We are in a web page which already have reference to jQuery. We don't have access to manipulate the original web page. The html string is present in one known TextArea in the loaded page. 

Our Javascript code is going to run from browser address bar.

Solution

So many constraints. But this was one of my requirement to modify width of tables present in my Evernote web page. Evernote don't have support to edit the table width once its created.

The technique is simple as follows
  • Get / parse the string into jQuery object
  • Use find() to select the objects
  • Once the objects are selected apply the changes.
See the jsFiddle below
http://stackoverflow.com/questions/22143055/replacing-manipulating-element-in-html-string-using-jquery

No comments: