Jump to content
Sign in to follow this  
Macchiato

Get Text And Put In Attribute Value

Recommended Posts

I have a Javascript that retrieves the text from between the "p" tags and put it in the title value, like this: before:<option title="" value="Put Text">Put Text</option> after:<option title="$1,179.83" value="Put Text">Put Text</option> The only problem is, it doesn't work in ie6-8. Does anyone know how to make this code work in ie6-8?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Get text and put in attribute value</title></head> <body>  <div class="Text"><p>$1,179.83</p></div>  <form action="">   <fieldset> 	<select class="putText" name="put-Text">	  <option id="" class="putTextOption" value="Put Text">Put Text</option>	</select>	  </fieldset> </form>  <script>window.onload=function() {  var pTag = document.getElementsByClassName("Text")[0].getElementsByTagName("p")[0];  var amount = pTag.innerHTML;  document.getElementsByClassName("putTextOption")[0].title=amount;}	</script>  </body></html>

Share this post


Link to post
Share on other sites

Only IE9 supports getElementsByClassName. You either need to use a different way to access those elements, or find a replacement for that function. I recommend accessing by ID instead of class. http://www.quirksmode.org/dom/w3c_core.html#fivemethods

  • Like 1

Share this post


Link to post
Share on other sites
Only IE9 supports getElementsByClassName. You either need to use a different way to access those elements, or find a replacement for that function. I recommend accessing by ID instead of class. http://www.quirksmod...tml#fivemethods
I replaced getElementsByClassName with getElementById and changed the classes to id's. Doesn't work, I get the error: 'document.getElementById(...).0' is null or not a object. What am I doing wrong?
window.onload=function() {  var pTag = document.getElementById("Text")[0].getElementsByTagName("p")[0];  var amount = pTag.innerHTML;  document.getElementById("putTextOption")[0].title=amount;}    

You can find a good replacement for getElementsByClassName here.
How do you implement this code?

Share this post


Link to post
Share on other sites

you don't need the [0] after getElementById(), only for ones which return an array of elements (more than 1), such as getElementsByName() and getElementsByTagName()

Share this post


Link to post
Share on other sites
How do you implement this code?
Just copy and paste it into a script tag in your document head. Then you can use getElementsByClassName just as you normally would. EDIT: FWIW, though, you are probably better off using getElementById since you are only getting a reference to a single element each time. Edited by ShadowMage

Share this post


Link to post
Share on other sites
Just copy and paste it into a script tag in your document head. Then you can use getElementsByClassName just as you normally would. EDIT: FWIW, though, you are probably better off using getElementById since you are only getting a reference to a single element each time.
Like this?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Get text and put in attribute value</title><script>if (!Array.prototype.contains) {   Array.prototype.contains = function (val) {	  for (var i = this.length - 1; i >= 0; --i) {		 if (this[i] == val) {		    return true;		 }	  }	  return false;   }}function myGetElementsByClassName (targetClass) {   var arr, myElements, len, i, myClassNames, j, pu######;   arr = [];   myElements = this.getElementsByTagName("*");   targetClass = targetClass.split(/\s+/);   len = myElements.length;   for (i = 0; i < len; ++i) {	  myClassNames = myElements[i].className.split(/\s+/);	  for (j = targetClass.length - 1; j >= 0; --j) {		 pu###### = true;		 if (!myClassNames.contains(targetClass[j]) ) {		    pu###### = false;		    break;		 }	  }	  if (pu######) {		 arr.push(myElements[i])	  }   }   return arr;}function init () {   if (!document.getElementsByClassName) {	  var myElements = document.body.getElementsByTagName("*");	  for (var i = myElements.length - 1; i >= 0; --i) {		 myElements[i].getElementsByClassName = myGetElementsByClassName;	  }	  document.getElementsByClassName = myGetElementsByClassName;   }}window.onload = init;</script></head><body><div id="Text"> <p>$1,179.83</p></div><form action="">   <fieldset>     <select class="putText" name="put-Text">	  <option id="putTextOption" value="Put Text">Put Text</option>    </select>      </fieldset> </form><script>window.onload=function() {  var pTag = document.getElementsByClassName("Text")[0].getElementsByTagName("p")[0];  var amount = pTag.innerHTML;  document.getElementsByClassName("putTextOption")[0].title=amount;}	   </script></body></html>

Doesn't seem to work :(

Share this post


Link to post
Share on other sites

that's a little vague. any errors? does something happen? nothing happen? From what I see, you are trying to execute two things on window.onload. Take the code from the bottom of the page (what's between the {} and put it at the end of the code snippet for init(), before the closing bracket. Then you should have no scripts at the bottom, and all stuff that you want to happen onload should be within the scope of the init function.

Edited by thescientist

Share this post


Link to post
Share on other sites

Yep, you are overwriting the onload handler. In the head script (ie, the script I linked you to) it sets window.onload to the init function. Then down at the bottom of your code, you set window.onload to a different function, overwriting the first. So when the onload function actually fires, only the second function executes. Because the first one never executed, getElementsByClassName remains undefined and will throw an error. Follow scientist's advice and move your second code snippet to the init function and it should work.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...