JavaScript - Changing The Href Of A Tag Dynamically
I have the index page which contains the menus with hrefs.
Now i have to generate the hrefs dynamically and the problem is the menus are created by the plugin so i can edit that file So i was thinking of loading the new url in hidden elemenst and when the page loads then chnage the hrefs of those menus. I want to ask that where on the page should i display the hidden elements so that when the page loads then by using JS i can chnage the href of few menu items I was thinking of doing that on the top of page but that does not look nice to have any element before body Similar TutorialsCan anyone let me know how can I get the href info dynamically I have 2 different webistes, just want to show those website urls dynamically <html> <body> <a href="http://www.yahoo.com" target="_blank">YAHOO</a> <a href="http://www.Google.com" target="_blank">Google</a> <script type="text/javascript"> document.write(href url of yahoo); document.write('href url of google); </script> </body> </html> thanks for help in advance Ok so i'm trying to write a Greasemonkey script to change all the hrefs on a single page. The href by default looks like this: Code: <a href="javascript:get('246154895')" class="postid">ID</a> What i'm trying to do is make the number from get() appear in stead of "ID". How should i get this done? I started up with this: Code: var posts = document.getElementsByClassname('postid'); for (i=0; i<posts.length; i++) { //Replacing } But i doubt it will work, since there are other items with the class "postid" that aren't related to these tags i'm trying to change. P.S. I'm new to JS so yeah :P hello i have this code that tags between three images in an certain amount of time and this works fine Code: <script language = "Javascript"> <?php $count_im=1; $req=mysql_query("select * from banner"); while ($res=mysql_fetch_array($req)){ ?> var image<?php echo $count_im; ?> =new Image() image<?php echo $count_im; ?>.src="<?php echo $res["banner"]; ?>" <?php $count_im++; }?> </script> Code: <div class="banner"> <p class="banner_image"> <img src="banner/12.jpg" name="slide" width="290px"> <script> <!-- //variable that will increment through the images var step=1 function slideit(){ //if browser does not support the image object, exit. if (!document.images) return document.images.slide.src=eval("image"+step+".src") if (step<3) step++ else step=1 //call function "slideit()" every ... seconds setTimeout("slideit()",10000) } slideit() //--> </script> </p> </div> and i want it also to tag between hrefs too, so tried the following but didnt work Code: <?php $count_im=1; $req=mysql_query("select * from banner"); while ($res=mysql_fetch_array($req)){ ?> var image<?php echo $count_im; ?> =new Image() image<?php echo $count_im; ?>.src="<?php echo $res["banner"]; ?>" var link<?php echo $count_im; ?> =new String() link<?php echo $count_im; ?>.href="<?php echo $res["banner_title"]; ?>" <?php $count_im++; }?> Code: <div class="banner"> <p class="banner_image"> <a href="" rel="nofollow" target="_blank" name="links"> <img src="banner/12.12" name="slide" width="290px"></a> <script> <!-- //variable that will increment through the images var step=1 function slideit(){ //if browser does not support the image object, exit. if (!document.images) return document.images.slide.src=eval("image"+step+".src") document.a.links.href=eval("link"+step+".src") if (step<3) step++ else step=1 //call function "slideit()" every ... seconds setTimeout("slideit()",10000) } slideit() //--> </script> </p> </div> anyone can help??? ok i have a script which will make a copy of the html in a div and place it into another div the problem with this it creates a duplicate element with the same id so what i want to know is can i create a new id based off old ids using a generic type script Code: function scope(e) { var popin = document.getElementById('popin'); popin.innerHTML = "<div class='container'>"+e.innerHTML+"</div>"; popin.style.display = "block"; } this code is designed for taking content in a small div and placing it into a larger div to increase the viewing area so what i would need is sumthing that can look for Code: id="sum text" and maybe amend it to Code: id="sum textP" or sumthing to that extent if sum1 could point me in the right direction that would be great if my post is not clear enough just ask me to be more specific or sumthing and i will see what i can do to try and make it more clear if needed hi i am totally frustrated !! i have been using this on my webpage. http://www.barelyfitz.com/projects/tabber/ if u see under the advanced section there is a code for changing tabs dynamically. Code: document.getElementById('mytab1').tabber.tabShow(0); this doesn't work. basically i have a webpage internet.htm. which has a menubar with loads of menu items. if i click one of the submenu items this code should change the dynamic tabs in admin.htm. the code i have defined for the submenu click is: Code: <li><a href="admin.htm" onClick="document.getElementById('Admin').tabber.tabShow(0)" >Forms</a></li> the full code is: Code: <ul id="QualityMenuBar" class="MenuBarHorizontal"> <li><a class="MenuBarItemSubmenu" href="#"><strong>Admin</strong></a> <ul> <li><a href="AdminDocuments.htm" onClick="document.getElementById("Admin").tabber.tabShow(0)" >Forms</a></li> <li><a href="AdminDocuments.htm" >Guidance</a></li> <li><a href="AdminDocuments.htm" onClick="document.getElementById("Admin").tabber.tabShow(2)" >Organisation Chart</a></li> <li><a href="AdminDocuments.htm">Plans</a></li> <li><a href="AdminDocuments.htm">Procedures</a></li> </ul> </li> this is what the admindocuments.htm contains, based on the website link i have borrowed the code from. Code: <div class="tabber" id="admin"> <div class="tabbertab"> <h2>Forms</h2> <script type="text/javascript" src="adminForms.js"></script> </div> <div class="tabbertab"> <h2>Guidance</h2> <script type="text/javascript" src="adminGuidance.js"></script> </div> <div class="tabbertab"> <h2>Org. Chart</h2> <script type="text/javascript" src="adminOrg.js"></script> </div> <div class="tabbertab"> <h2>Plans</h2> <script type="text/javascript" src="adminPlans.js"></script> </div> <div class="tabbertab"> <h2>Procedures</h2> <script type="text/javascript" src="adminProc.js"></script> </div> </div> whenever i click the submenu they all point to the first tab only. it doesn't change inspite of the code. what am i doing wrong here? please advice. Many thanks. I have a javascript function that changes the src and href of an image within a repeating function. If i call document.getelementbyid("image").src, i can change the image and by calling document.getelementbyid("image").Href, i am able to change the link. The problem i have now is that when the cursor goes over the image it gets the link location as a snapshot. If i leave my cursor and the image and link location changes, it does not update the snapshot and if i click on the new image it uses the previous link rather than the new one. The only way to get the new link is to move off the image and back on to get a new snapshot of the new link. Is there a way i can tell the javascript to change the image, link location and update the browser to the new link without moving the cursor.
Hi everyone, I'm currently in the process of making a spreadsheet like webpage and it all working fine... However I have been using setAttribute and removeAttribute in order to dynamically change a table cells onclick property. This of course does not work in IE7 etc and I've been banging my head against a brick wall trying to come up with a solution that will work in all browsers but I just can't seem to get it to work with using methods such as... Code: document.getElementById(myElementId).onclick = scriptToRun; document.getElementById(myElementId).attachEvent('onclick',scriptToRun); I get all sorts of not implemented, type mismatch errors when I try to use the above. Below is the setAttribute code which works. Code: document.getElementById("task_" + colName + studentId).setAttribute("onclick","showTaskDropDown('task_" + colName + studentId + "','" + studentId + "','" + colName + "','" + value + "','" + maxValue + "','" + trafficMaxValue + "','" + taskNumber + "')"); If anyone can see why the other methods aren't working and can provide a solution I'll be extremely greatful! hi, have a series of 2 pages. The first is a drop down select box that gathers the state name. Onclick we are using a window.open to open a page with a list of cities for that state. Again using a drop down select box to select the city and then, onclick, we send the user off to the appropriate page based on state/city selection while at the same time updating the 1st (parent) page with a new location.href. Problem is that instead of updating the parent page, it updates the page with the list of cities (the child page). On the first page script we generate the following warning: Warning: XUL box for _moz_generated_content_after element contained an inline #text child, forcing all its children to be wrapped in a block. Source File: chrome://browser/content/browser.xul Line: 0 First page is not generated via javascript but standard html. This happens both locally and when pages are moved to the server (Apache). First page script is as follows Code: <HTML> <HEAD> <TITLE>J1</TITLE> <SCRIPT LANGUAGE="JavaScript"> function StateSelect (form) { Item = form.state.selectedIndex; Result = form.state.options[Item].value; window.open('j2.htm?value='+ Result,'myWindow','resizeable=no,resizeable=0,scrollbars=no,scrollbars=0,location=no,location=0,toolbar=no,toolbar=0,directories=no,directories=0,menubar=no,menubar=0,status=no,status=0,copyhistory=no,copyhistory=0,width=300,height=100,left=300,top=300,screenX=300,screenY=300') } </SCRIPT> </HEAD> 2nd page (where user selects city) code is as follows: Code: <SCRIPT LANGUAGE="JavaScript"> function CitySelect (form) { Item = form.city.selectedIndex; city = form.city.options[Item].value; state = document.myform.state.value; window.open('j3.htm','mywindow3') setTimeout("Func1()",3000); } function Func1() { parent.location.href='j4.htm?st='+ state + '&city=' + city,'mywinow2'; } </SCRIPT> Ideas on why and what the error (actually a warning) is trying to tell us? Thank you all! Jim Hi All I have a piece of script which makes a div slide out from the side of the screen with information on it. I can change the innerHtml etc no problem, but i have a problem with change .style attributes dynamically. My code: Code: var mystring = "height:500px"; var keyVal = mystring.split(":") var slidingDiv = document.getElementById('slidingDiv'); slidingDiv.style.keyVal[0] = keyVal[1]; As you see above i get a value which i need to split() to get the key and value to use. So what i would like to see is: Quote: slidingDiv.style.height = 500px; But it does not work, as there is no such function as slidingDiv.style.keyVal[0]; How do i change this? I hope I've explained this thoroughly enough. Please ask if i need to explain further. Regards Marinus Is it possible to dynamically change the value of text on a page as the user types into a text box? E.g. like: You Are Typing: <script> var keyword = document.getElementById('string'); document.write(keyword); </script> Or I could probably insert it into a function and loop it over and over again or is there a better way? Hi all and hope that you can help. I have an image slideshow that works fine and, I may be being over ambitious but I'd like to combine the Play and Pause buttons so that when the slideshow is playing, the Play button is replaced by the Pause button and when it is paused the Pause button is replaced by the Play button. Sounds like a simple JavaScipt change image function but both buttons have roll over effects and they both have different JavaScript functions assigned to them so I'm struggling to get my head around what I need to do. Thanks for your interest, R I've highlighted the relevant chunks of code below... The HTML / CSS... Code: <style type="text/css"> #midcol { padding: 0 25px; width: 672px; margin-left:auto; margin-right:auto; text-align:center; } #first {height:32px; width:32px; text-indent:-9999px; overflow:hidden; display:inline-block; border:0; background:url(navbars/first.gif) no-repeat 0 0; } #previous {height:32px; width:32px; text-indent:-9999px; overflow:hidden; display:inline-block; border:0; background:url(navbars/previous.gif) no-repeat 0 0; } #pause {height:32px; width:32px; text-indent:-9999px; overflow:hidden; display:inline-block; border:0; background:url(navbars/pause.gif) no-repeat 0 0; } #pplay {height:32px; width:32px; text-indent:-9999px; overflow:hidden; display:inline-block; border:0; background:url(navbars/play.gif) no-repeat 0 0; } #next {height:32px; width:32px; text-indent:-9999px; overflow:hidden; display:inline-block; border:0; background:url(navbars/next.gif) no-repeat 0 0; } #last {height:32px; width:32px; text-indent:-9999px; overflow:hidden; display:inline-block; border:0; background:url(navbars/last.gif) no-repeat 0 0; } #first:hover {background:url(navbars/first.gif) no-repeat 0 -32px; } #previous:hover {background:url(navbars/previous.gif) no-repeat 0 -32px;} #pause:hover {background:url(navbars/pause.gif) no-repeat 0 -32px;} #pplay:hover {background:url(navbars/play.gif) no-repeat 0 -32px;} #next:hover {background:url(navbars/next.gif) no-repeat 0 -32px;} #last:hover {background:url(navbars/last.gif) no-repeat 0 -32px;} </style> </head> <body> <div id="midcol"> <table width="592" border="0"> <tr > <td colspan="8" height="450"><img id="myImage" name="myImage" src="images/large/1.jpg"></img></td></tr> <tr><td colspan="8"><br /></td></tr> <tr height="60"><td colspan="8" id="caption">Auto play will start when all the images have loaded...</td></tr> <tr height="33"> <td width="160"></td> <td id="first" onclick="first();clearTimeout(timerID);"></td> <td id="previous" onclick="previous();clearTimeout(timerID);"></td> <td id="pause" onclick="clearTimeout(timerID);"></td> <td id="pplay" onclick="swapPicture();"></td> <td id="next" onclick="next();clearTimeout(timerID);"></td> <td id="last" onclick="last();clearTimeout(timerID);"></td> <td width="160"><form name="dropdown" action="">Slide duration: <select id="duration" onchange="setInterval(this.form.duration);"> <option value="1">1</option> <option value="2">2</option> <option value="3" selected="selected">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </form></td> </tr> </table> The JavaScript... Code: var dimages=new Array(); var numImages=31; var interval = 3000; var image_dir = "images/large/" for (i=0; i<numImages; i++) { dimages[i]=new Image(); dimages[i].src=image_dir+(i+1)+".jpg"; } var imageCaption = new Array(); var ImageNum = 0; imageCaption[ImageNum++] = "Caption 1."; imageCaption[ImageNum++] = "Caption 2."; etc. etc. var curImage=-1; function swapPicture() { if (document.images) // does the browser support image changes? { var nextImage=curImage+1; if (nextImage>=numImages) nextImage=0; if (dimages[nextImage] && dimages[nextImage].complete) // has the next image been fully loaded? { var target=0; if (document.images.myImage) target=document.images.myImage; cap = imageCaption[nextImage]; document.getElementById('caption').innerHTML=cap; if (document.all && document.getElementById("myImage")) target=document.getElementById("myImage"); cap = imageCaption[nextImage]; document.getElementById('caption').innerHTML=cap; // make sure target is valid. It might not be valid // if the page has not finished loading if (target) { target.src=dimages[nextImage].src; curImage=nextImage; } doTimer(interval); } else { setTimeout("swapPicture()", 500); // if not fully loaded, wait 500ms then try again. } } } function first(){ // Goes to the 1st image and stops curImage=-1; stopTimer(); swapPicture(); } function last(){ // Goes to the last image and stops curImage=numImages-2; stopTimer(); swapPicture(); } function previous(){ // Goes to the previous image and stops curImage=curImage-2; stopTimer(); swapPicture(); } function next(){ // Goes to the next image and stops stopTimer(); swapPicture(); } function doTimer(interval){ // The Play button timerID=setTimeout("swapPicture()",interval); } function stopTimer(){ // The Pause button clearTimeout(timerID); } function setInterval(t){ // The slide duration drop down box. var e = document.getElementById("duration"); interval = (e.options[e.selectedIndex].value)*1000; } doTimer(interval); // Starts the slideshow on load. Hi Friends, I need to select browser option dynamically using javascript for handling cookies , i.e., in need select checkbox "override automatic cookie handling" checkbox dynamically. Kindly help me friends how to select this checkbox dynamically. Tools - -> Internet Options --> Privacy (Tab) --> Advance (Button) --> Override automatic cookie handling . Thanks in Advance, Siva. I am building an online survey using a survey creation tool which allows me to incorporate javascript for additional functionality. However, I am new to javascript so would appreciate any help that you could provide me with. I have question types like agreement scales, where the respondent sees a list of statements and has to rate each one by clicking on a radio button. The source code of the matrix table looks like this: Code: <thead><tr class="Answers"> <th class='c1 BorderColor' width="25%" class='c1'> </th> <th class='c2 BorderColor' class='c2 yAxisBorder' > </th> <th class='c3 BorderColor' class='c3 yAxisBorder' > </th> <th width="25%" class='Selection BorderColor c4 ' id='header~QID19~1~4' > <label>Disagree</label> </th> <th width="25%" class='Selection BorderColor c5 ' id='header~QID19~2~5' > <label>Neither agree nor disagree</label> </th> <th width="25%" class='Selection BorderColor c6 last ' id='header~QID19~3~6' > <label>Agree</label> </th> </tr></thead><tr class='ChoiceRow '><th class='c1' id='header~QID19~1'><span class='LabelWrapper'><label for='QR~QID19~1'>Statement 1</label></span> </th><td class='c2 BorderColor' class='c2 yAxisBorder' headers='header~QID19~1' > </td><td class='c3 BorderColor' class='c3 yAxisBorder' headers='header~QID19~1' > </td><td class='c4 ' headers='header~QID19~1~4 header~QID19~1'><input type='radio' name='QR~QID19~1' value='QR~QID19~1~1' ></td><td class='c5 ' headers='header~QID19~2~5 header~QID19~1'><input type='radio' name='QR~QID19~1' value='QR~QID19~1~2' ></td><td class='c6 last ' headers='header~QID19~3~6 header~QID19~1'><input type='radio' name='QR~QID19~1' value='QR~QID19~1~3' ></td></tr><tr class='ChoiceRow ReadableAlt '><th class='c1' id='header~QID19~2'><span class='LabelWrapper'><label for='QR~QID19~2'>Statement 2</label></span> </th><td class='c2 BorderColor' class='c2 yAxisBorder' headers='header~QID19~2' > </td><td class='c3 BorderColor' class='c3 yAxisBorder' headers='header~QID19~2' > </td><td class='c4 ' headers='header~QID19~1~4 header~QID19~2'><input type='radio' name='QR~QID19~2' value='QR~QID19~2~1' ></td><td class='c5 ' headers='header~QID19~2~5 header~QID19~2'><input type='radio' name='QR~QID19~2' value='QR~QID19~2~2' ></td><td class='c6 last ' headers='header~QID19~3~6 header~QID19~2'><input type='radio' name='QR~QID19~2' value='QR~QID19~2~3' ></td></tr><tr class='ChoiceRow bottom '><th class='c1' id='header~QID19~3'><span class='LabelWrapper'><label for='QR~QID19~3'>Statement 3</label></span> </th><td class='c2 BorderColor' class='c2 yAxisBorder' headers='header~QID19~3' > </td><td class='c3 BorderColor' class='c3 yAxisBorder' headers='header~QID19~3' > </td><td class='c4 ' headers='header~QID19~1~4 header~QID19~3'><input type='radio' name='QR~QID19~3' value='QR~QID19~3~1' ></td><td class='c5 ' headers='header~QID19~2~5 header~QID19~3'><input type='radio' name='QR~QID19~3' value='QR~QID19~3~2' ></td><td class='c6 last ' headers='header~QID19~3~6 header~QID19~3'><input type='radio' name='QR~QID19~3' value='QR~QID19~3~3' ></td></tr><input type=hidden name='Transformation~QID19~1' value='YToxOntzOjEwOiJRUn5RSUQxOX4xIjtzOjE2OiJ7dmFsdWV9PVNlbGVjdGVkIjt9' id=''><input type=hidden name='Transformation~QID19~2' value='YToxOntzOjEwOiJRUn5RSUQxOX4yIjtzOjE2OiJ7dmFsdWV9PVNlbGVjdGVkIjt9' id=''><input type=hidden name='Transformation~QID19~3' value='YToxOntzOjEwOiJRUn5RSUQxOX4zIjtzOjE2OiJ7dmFsdWV9PVNlbGVjdGVkIjt9' id=''></table></div> I don't have any control over the HTML as this is generated by the survey tool. However, the survey tool has a "JavaScript Editor" for each question, where I can put in javascript functions, and it executes them when the page loads. What I want to do is to have the label for each row (i.e for each statement) to change color when a corresponding radio button has been selected. This way, it is easier for respondents to see which rows they have answered. I used the following JS code: Code: var radioname = []; var radiolist = []; var labelspans = []; var labels = []; var radios = []; var count; var spans = document.getElementsByTagName('span'); function getLabels() { for (x=0; x<spans.length; x++) { if (spans[x].className == "LabelWrapper") { labelspans.push(spans[x]); } } for (y=0; y<labelspans.length; y++) { labels.push(labelspans[y].firstChild); radioname.push(labelspans[y].firstChild.htmlFor); } } function getRadios() { //will put all radio groups into the "radiolist" array for (z=0; z<radioname.length; z++) { radiolist.push(document.getElementsByName(radioname[z])); //will add Event Listener to each radio button, and add each one to the "radios" array for (i=0; i<radiolist[z].length; i++) { chkradio = radiolist[z][i]; chkradio.setAttribute("count",Number(z)); chkradio.addEventListener("click", function(){changeLabel()}, false); radios.push(chkradio); } } } function changeLabel() //loops through all the radios to check if they are selected, and changes label color accordingly { for (w=0; w<radios.length; w++) { if (radios[w].checked) { a = radios[w].getAttribute("count"); labels[a].innerHTML = labels[a].innerHTML.fontcolor("green"); } } } getLabels(); getRadios(); This code works as intended; however, as you can see, it loops through all the radio buttons when one is clicked. Is there a way to accomplish this without looping through all the radios, and thus make the script run faster? Also, I have read that the addEventListener function does not work for older versions of IE. Is there a simpler alternative? Hi, I'm using the following Javascript code to show a div layer depending on the URL Code: <script type="text/javascript"> if (location.href.match(/folder/)) { document.getElementById("div-layer").style.display="block"; } </script> This works perfectly when I visit http://www.domain.com/folder but I do not want it to match any subfolders beneath /folder, for example: http://www.domain.com/folder/sub-folder http://www.domain.com/folder/sub-folder2 etc. Does anyone know how I can modify the code to only match /folder or /folder/ and no subfolders beneath it? Thank you in advance. At first : Peace of code i have now: Code: <a onclick="doRate('-1', '{$id}'); return false;"><img src="{THEME}/dleimages/down.gif" title="Blogai(-)" alt="Blogai(-)" class="r2-unit" width="16" height="16" align="absmiddle" /></a> So i thinking that if user has JavaScript in his browser disabled it won't work. So gonna change it to this : like i saw in other webs: Code: <a onclick="doRate('-1', '{$id}'); return false;" href="llink.html"><img src="{THEME}/dleimages/down.gif" title="Blogai(-)" alt="Blogai(-)" class="r2-unit" width="16" height="16" align="absmiddle" /></a> But i'm afraid that if user WILL have JS support enabled, href tag will be executed anyways. Any ideas? We have a function that validates a form and then does submit (and a bunch of other stuff) We called it using: Code: <td class="MyButtonStyle"> <a href="#" OnClick="MyFunction();" title="Save changes and continue">SAVE</a> </td> This worked fine on the browsers we were using (IE6 in the main), but we now find doesn't work on IE5.01, Mac and some others. OK, so having done some research I now realise I needed RETURN FALSE in OnClick. So ... faced with having to change a lot of pages I'd like to have the best possible syntax (by which I suppose I rellay mean most-browser-compatible), and I've seen a number of options; advice on picking a good'un would be much appreciated. Amongst the stuff I've seen is: Code: 1. href="#" onclick="MyFunction();return false;" 2. href="#null" onclick="MyFunction();return false;" 3. href="NoJavaScriptAbility.htm" onclick="MyFunction();return false;" 4. href="#" onclick="return MyFunction();" 5. href="javascript:;" onclick="return MyFunction();" 6. href="javascript://" onclick="return MyFunction();" 7. href="javascript:void(0);" onclick="return MyFunction();" 8. href="javascript:MyFunction();" What about what shows in the Status bar? Should I have an OnMouseOver event too to describe what MyFunction is going to do? Rather than displaying a meaningless link. Anything else to note? (This function is part of a library being reused for major web site development over the next however many years, and not for single-project build-and-throw-away, so all possible functionality, including The Kitchen Sink!, is up for consideration). Thanks Kristen Hi everyone, I am looking for JS script to replace find all the href values on a page and replace those href values matching them with an array of values. my array, lets say is a = {'some.ex.com', 'abc.ex.com/tv', 'some.name.ex.com', 'bcd.ex.com/dir1/dir2/some.jsp' }; etc i want to find all the URLs on a given page, check if each found url matches with any of the values in the array, if match found, just replace only "ex.com" with "example.com" for every match. I am all new to JS and please please help Many thanks if f returns true then href gets 'executed', else not. Works in FF, GC. In IE 7 does not work. How to get this working in IE ? Code: <a onclick="return f();" href="../jsp/..."> Code: function f() { return true; } Please check out the code and tell me how can i use the variable as a href link. var rand_link = new Array (); rand_link[0]="asdhrfe22k"; rand_link[1]="iqh3wjhs8s"; rand_link[2]="snbds7s8h3"; rand_link[3]="=jh99shhs99"; rand_link[4]="shdbfh3h83"; var rand = Math.floor(5 * Math.random()); var ref = rand_link[rand]; document.write("<a href=http://www.youtube.com/watch?v= [with the variabel "ref"]>Click here</a>"); where, the array of links are in rand_link. I have to rework a script now, and I'm wondering how to change the script below to find the text inside of a href tag that is nested inside div class "posted-by". I want the result "Name Surname" here's what it's searching in: Code: <span class="posted-by"> <a href="/from_the_heart/author/namesurname"> <img class="inline-icon user-registered-icon" src="/universal/images/transparent.png" alt="Author" title="Author"> Name Surname </a> </span> And here's the existing code. I got some help on codingforums to create the script below that strips down to the 'a href' but now I need the text inside (because there's a space between the first and last name) Code: function doit() { if($('div').hasClass('single-journal-entry-wrapper')) { var theURL = null; var spans = document.getElementsByTagName("span"); for ( var s = 0; s < spans.length; s++ ) { // searching through spans for the class name: var span = spans[s]; if ( span.className.indexOf("posted-by") >= 0 ) { var useit = span.getElementsByTagName("a")[0]; theURL = useit.href; break; // Here things deviate.I need the text inside the href } } if ( theURL == null ) { alert("failed!"); } else { var parts = theURL.split('/'); var result = parts[parts.length-1]; if (result == "christopheryen") { var txt=document.getElementById("author"); txt.innerHTML="adsfasdfasdf"; } else if (result == "juliapatrick") {etc.} |