title: DOM manipulation using PhantomJS
body: <p>I'm web scraping a web page Using Phantomjs and replacing canvas element with image as follows. but when I try to modify some element's inner HTML to image its not working. Can any one tell me what's wrong?</p>
  
  <pre><code>var page = require('webpage').create();
  var fs = require('fs');
  var URL = 'some web url';
  
  page.open(URL, function(status) {
  
      if (status !== 'success') {    
          console.log('Unable to access network');
      } else {
  
          var clipRect = page.evaluate(function() {
              return document.getElementById("some-id").getBoundingClientRect();
          });
  
          page.clipRect = {
              top : clipRect.top,
              left : clipRect.left,
              width : clipRect.width,
              height : clipRect.height
          };
          page.render('canvas.png');
  
          // modify one element's inner html before writing into file
          // document.getElementById("some-id").innerHTML = '&lt;img src="capture.png"&gt;';
  
          fs.write('email.html', page.content, 'w');
  
          phantom.exit();
  
      }
  
  });
  </code></pre>
  
  <p>PS: New to nodejs and phantomjs</p>