Remove empty tag with javascript
July 17, 2008 6:16 PM Subscribe
I need some help creating some javascript that will remove an empty img tag.
Ok.. So i have the following code in my page. What i am looking to do, is add the ability to remove the empty img tag(<img src="">) by clicking on the Select All button.
If you can show me how to code that, or point me in the right direction (keeping in mind that I have 0 experience with js), I would be greatly appreciative.
Note: Having the script run by clicking on this button isn't really what i want, but the way I see it (which may be, and usually is wrong) seems like the only way to make sure it only runs on the one page i need it to run on. The site consists of many, many includes. The page I need the script on is structured like so... main.html (containing the HEAD and BODY tag) and then page_i_want_script_to_run.html (containing the code I want the script to run on). Is there a way to get the script to run on page_i_want_script_to_run.html automatically on page load, without putting it in the BODY tag of main.html? If so, I would probably go that route.
<!-- Main.html -->
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function copyit(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
}
// End -->
</script>
</HEAD>
<BODY>
<!-- Main.html -->
<!-- page_i_want_script_to_run.html -->
<form name="it">
<div align="center">
<input onclick="copyit('it.select1')" type="button" value="Select All" name="cpy">
<textarea class="code" name="select1" rows="3" cols="25">
<img src="example.jpg">
<img src=""> <!-- help me remove this tag... -->
<img src="example2.jpg">
</textarea>
</div>
</form>
<!-- page_i_want_script_to_run.html -->
Ok.. So i have the following code in my page. What i am looking to do, is add the ability to remove the empty img tag(<img src="">) by clicking on the Select All button.
If you can show me how to code that, or point me in the right direction (keeping in mind that I have 0 experience with js), I would be greatly appreciative.
Note: Having the script run by clicking on this button isn't really what i want, but the way I see it (which may be, and usually is wrong) seems like the only way to make sure it only runs on the one page i need it to run on. The site consists of many, many includes. The page I need the script on is structured like so... main.html (containing the HEAD and BODY tag) and then page_i_want_script_to_run.html (containing the code I want the script to run on). Is there a way to get the script to run on page_i_want_script_to_run.html automatically on page load, without putting it in the BODY tag of main.html? If so, I would probably go that route.
<!-- Main.html -->
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function copyit(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
}
// End -->
</script>
</HEAD>
<BODY>
<!-- Main.html -->
<!-- page_i_want_script_to_run.html -->
<form name="it">
<div align="center">
<input onclick="copyit('it.select1')" type="button" value="Select All" name="cpy">
<textarea class="code" name="select1" rows="3" cols="25">
<img src="example.jpg">
<img src=""> <!-- help me remove this tag... -->
<img src="example2.jpg">
</textarea>
</div>
</form>
<!-- page_i_want_script_to_run.html -->
If you can surround each img tag with a div or span and then give each a unique id this may help.
function removeElement(divNum) {
var d = document.getElementById('myDiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
Found Here
posted by dyno04 at 7:16 PM on July 17, 2008
function removeElement(divNum) {
var d = document.getElementById('myDiv');
var olddiv = document.getElementById(divNum);
d.removeChild(olddiv);
}
Found Here
posted by dyno04 at 7:16 PM on July 17, 2008
Best answer: This is really easy with JQuery: $(img[src=""]).remove();
posted by Nelsormensch at 9:19 PM on July 17, 2008
posted by Nelsormensch at 9:19 PM on July 17, 2008
The below JavaScript should remove all img tags from a page the src being blank. There's no need to wrap it around a div or span.
var imgTags = document.getElementsByTagName("img");
for(var i = 0; i <> if(imgTags[i].getAttribute("src") === "")
imgTags[i].parentNode.removeChild(imgTags[i]);
}
I'll admit that the jQuery version is much nicer but sometimes you don't want to use a library.
If you don't know much about JavaScript, I'd recommend getting a book such as JavaScript: The Definitive Guide to get to grips with it, or at least using Mozilla's reference for the DOM and JavaScript.
posted by HaloMan at 12:20 AM on July 18, 2008
var imgTags = document.getElementsByTagName("img");
for(var i = 0; i <> if(imgTags[i].getAttribute("src") === "")
imgTags[i].parentNode.removeChild(imgTags[i]);
}
I'll admit that the jQuery version is much nicer but sometimes you don't want to use a library.
If you don't know much about JavaScript, I'd recommend getting a book such as JavaScript: The Definitive Guide to get to grips with it, or at least using Mozilla's reference for the DOM and JavaScript.
posted by HaloMan at 12:20 AM on July 18, 2008
Sadly the site mangled my above code. I meant this:
var imgTags = document.getElementsByTagName("img");
for(var i = 0; i < imgTags.length; i++) {
if(imgTags[i].getAttribute("src") === "")
imgTags[i].parentNode.removeChild(imgTags[i]);
}
posted by HaloMan at 12:23 AM on July 18, 2008
var imgTags = document.getElementsByTagName("img");
for(var i = 0; i < imgTags.length; i++) {
if(imgTags[i].getAttribute("src") === "")
imgTags[i].parentNode.removeChild(imgTags[i]);
}
posted by HaloMan at 12:23 AM on July 18, 2008
Is there a way to get the script to run on page_i_want_script_to_run.html automatically on page load, without putting it in the BODY tag of main.html? If so, I would probably go that route.
If you put the code in a SCRIPT tag at the bottom of page_i_want_script_to_run.html, it will only run if that include is loaded and only when the other HTML code on that page has been read. If you want it to run just as if it had been included in the body ONLOAD attribute, you can extend that attribute within the script itself with
window.onload = window.onload+ 'removeImg()'
(this way you don't overwrite any other onload events you may have).
To be cleaner, you should put your code in a .js file and refer to it in the SCRIPT tag via the SRC attribute so you can reuse it on other pages if required.
posted by Sparx at 4:40 AM on July 18, 2008
If you put the code in a SCRIPT tag at the bottom of page_i_want_script_to_run.html, it will only run if that include is loaded and only when the other HTML code on that page has been read. If you want it to run just as if it had been included in the body ONLOAD attribute, you can extend that attribute within the script itself with
window.onload = window.onload+ 'removeImg()'
(this way you don't overwrite any other onload events you may have).
To be cleaner, you should put your code in a .js file and refer to it in the SCRIPT tag via the SRC attribute so you can reuse it on other pages if required.
posted by Sparx at 4:40 AM on July 18, 2008
Response by poster: Neither of the above solutions seem to be working.
http://thelastreal.com/rmv_img.html
See something I am doing wrong?
posted by B(oYo)BIES at 9:17 AM on July 18, 2008
http://thelastreal.com/rmv_img.html
See something I am doing wrong?
posted by B(oYo)BIES at 9:17 AM on July 18, 2008
Best answer: I think the jQuery example should be $('img[src=""]').remove();
posted by JonB at 12:17 PM on July 18, 2008
posted by JonB at 12:17 PM on July 18, 2008
Best answer: Or for the javascript part you need to move the script below the image tag. Basically that script is running as the page loads and it doesn't know there is an img tag there yet. Put it at the end of the page to be sure you get all img tags on the page.
posted by unsigned at 12:28 PM on July 18, 2008
posted by unsigned at 12:28 PM on July 18, 2008
Response by poster: That unfortunately did not work either. Thanks for giving it a shot.
posted by B(oYo)BIES at 12:29 PM on July 18, 2008
posted by B(oYo)BIES at 12:29 PM on July 18, 2008
Response by poster: unsigned - Your the man. Thank you!
posted by B(oYo)BIES at 12:30 PM on July 18, 2008
posted by B(oYo)BIES at 12:30 PM on July 18, 2008
This thread is closed to new comments.
posted by niles at 6:49 PM on July 17, 2008