views:

19

answers:

1

Hi There

I am trying to capture html

<title></title>

and Metadata from with in a form1 but not exactly sure how to do it...

My quess is to do it like: document.write(document.form1.title); or document.write.texteara.(document.form1.title); but this is not working for me...

  <textarea name="textarea" id="textarea" cols="45" rows="5"><title>This is the title tag extracted</title><meta name="keywords" content="test 1, test 2, test3" /></textarea>
  </label>
</form>
<script type="text/javascript" src="<%= g_page_site_actual %>/js/jquery-1.4.2.min.js"></script>
<script language="JavaScript"><!--
if (document.getElementsByName) {
  var metaArray = document.getElementsByName('Author');
  for (var i=0; i<metaArray.length; i++) {
    document.write(metaArray[i].content + '<br>');
  }

  var metaArray = document.getElementsByName('Description');
  for (var i=0; i<metaArray.length; i++) {
    document.write(metaArray[i].content + '<br>');
  }

  var metaArray = document.getElementsByName('Keywords');
  for (var i=0; i<metaArray.length; i++) {
    document.write(metaArray[i].content + '<br>');
  }
}
document.write(document.form1.title);
//--></script>

Any ideas how I can capture the metadata from within a textarea?

+1  A: 

A textarea contains a simple string of text. There are no elements or metadata.

<textarea name="textarea" id="textarea" cols="45" rows="5"><title>This is the title tag extracted</title><meta name="keywords" content="test 1, test 2, test3" /></textarea>

This is invalid, though browsers typically fix it up for you (until the sequence </textarea, anyway). You must HTML-encode < and & in the content of a <textarea> just like all text content and attribute values:

<textarea name="textarea" id="textarea" cols="45" rows="5">&lt;title>This is the title tag extracted&lt;/title>&lt;meta name="keywords" content="test 1, test 2, test3" /></textarea>

You'd then read the contents of the textarea with input.value as with any other field.

If you want to parse that string value into an HTML document and extract parts of it, you'll need to write it to an element using element.innerHTML= value and then use DOM methods to extract data from the element:

var el= document.createElement('head');
el.innerHTML= document.getElementById('textarea').value;
alert(el.getElementsByTagName('title')[0].firstChild.value);
alert(el.getElementsByTagName('meta')[0].content);

Unfortunately IE can't do this because it can't set innerHTML on <head> or many other elements that aren't normal block/inline elements. To get it to work on IE, you'd have to use a complete new document for the content to go into (what a pain):

<iframe id="iframe"></iframe>
<script type="text/javascript">
    var iframe= document.getElementById('iframe');
    var idoc= 'contentDocument' in iframe? iframe.contentDocument : iframe.contentWindow.document;
    idoc.write(document.getElementById('textarea').value);
    idoc.close();
    alert(idoc.title);
    alert(idoc.getElementsByTagName('meta')[0].content);
</script>

It seems to me very unlikely that this is a good idea. Can't you have the server-side generate a page that passes information that JavaScript needs to use in a manner more convenient to JavaScript? eg. spit out a JSON-encoded lookup like:

<script type="text/javascript">
    var info= {
        "title": "This is the title tag extracted",
        "keywords": ["test 1", "test 2", "test3"]
    };
</script>
bobince