Solved

How to get correct .innerHTML result

Posted on 2000-03-29
4
140 Views
Last Modified: 2011-09-20
Hi!

Problem: I need exact HTML inside given <SPAN> tag, .innerHTML property strips quots around attribute values.
Environment: ie5+

Do you know a way to get that HTML as is?

my task is to transform client-side-edited piece of HTML4 with XSL. XMLDOM object requires 'correct' xml initialization like <DIV CLASS="node">...</DIV>, but .innerHTML just yelds <div class=node>...</div> instead. It behaves better with complex values like CLASS="node it is", but such classnames spoil CSS. :(
0
Comment
Question by:drom
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
4 Comments
 
LVL 7

Expert Comment

by:nettrom
ID: 2668623
seems to me that IE lives by the HTML spec, quotes are optional.

are you looking for a way to have quotes around all attribute values, or simply class?  if it's only class you could pull it out using object.className (http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/classname.asp)

another workaround would be to do use regular expressions (I believe IE5 supports those) and add single/double quotes around all attributes through a quick'n'dirty s/(\w)+=(\w+)\s/$1="$2"\s/;
0
 
LVL 1

Author Comment

by:drom
ID: 2668695
thanks, nettrom.
I need well-formed xml that means no attributes without value and all values quoted.
sure, I can trepanate everything with DOM on my own, but it's not too pleasant.
anyway, thank you :) your regexp looks promising if it will work for tag attributes only.
0
 
LVL 7

Accepted Solution

by:
nettrom earned 125 total points
ID: 2668773
yeah, I know about those well-formed restrictions, so I knew you had to get the values quoted.

I read up a bit about this on the MSDN site, and tested it out with IE5.  a quick solution that only works with attributes containing word-characters (a-z, A-Z, 0-9 if I remember correctly) works as follows:

  var myValue = myObject.innerHTML;
  var breakPoint = myValue.indexOf(">")+1;
  var startTag = myValue.substring(0,breakPoint);
  var regExp = /(\w+)=(\w+)/g;
  var result = startTag.replace(regExp, "$1=\"$2\"");
  var newElement = result + myValue.substring(breakPoint);

very explicit programming here, rough example.  I'm not sure how familiar you are with regular expressions.  I'll ellaborate & explain if you want me to.
0
 
LVL 1

Author Comment

by:drom
ID: 2669196
I'm not too familiar with regular expressions, but your answer was enough. Next code does almost what I need:

var r = object.innerHTML;
var re = /(<[^>]*)(\w+)=([^\s">]+)([^<]*>)/g;
while(re.test(r)) r = r.replace(re, "$1$2=\"$3\"$4");

Thank you.
Dmitry.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

724 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question