how to add image based on if condition in JavaScript

**Dormilich** · Apr 25 '12, 12:37 PM

but document.write( ) opens a new window how to avoid it ?

document.write( ) doesn’t open a new window (that’s window.open()). it recreates the page if used after page load.

**123123om** · Apr 26 '12, 06:37 AM

thanks for the reply. but no luck, when i tried with document.write( ) it vanishes the details of current window and displays the image in new window. please let me know is there any other way to do this ?

Code:

 document.URL = "../images/sunny.gif";
                                                 document.images.src = "../images/t-showers.gif";

i have tried with above code also but still no luck.. please help me.

**Dormilich** · Apr 26 '12, 07:02 AM

but no luck, when i tried with document.write( ) it vanishes the details of current window and displays the image in new window.

that’s what I said with "recreating the page".

i have tried with above code also but still no luck

of course, document.URL is read-only (and wouldn’t be an image either) and document.images is a List, not an image element.

what you would need to do is insert an <img> element into the document tree (but since I don’t have enough information about the where and how, I can’t provide even demo code).

besides that, Strings do not have an .innerHTML property. or vice versa, HTMLElements do not equal Strings (unless you get the element stringification right)

**123123om** · Apr 26 '12, 09:28 AM

thanks for the reply. u said as that’s what I said with "recreating the page". could you let me know how to do this ?
what you would need to do is insert an

Code:

<img>

element into the document tree: please let me know how to add ?

and also could anyone post the demo code ? which will help me a lot. thanks in advance

**Dormilich** · Apr 26 '12, 09:43 AM

using a simplified example where I insert an image into a document

Code:

<!DOCTYPE html>
<html>
	<head>
		<title>Test Centre</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	</head>
	<body>
		<div id="test"></div>
		<script type="text/javascript" src="test.js"></script>
	</body>
</html>

Code:

// test.js
document.getElementById("test").innerHTML = '<img src="pic.png" width="200" height="100" alt="a demo picture">';
// or
// document.querySelector("#test").innerHTML = '<img src="pic.png" width="200" height="100" alt="a demo picture">';

**123123om** · Apr 26 '12, 10:49 AM

http://10.140.1.193:8090/OfficeInfo/Weather.html

**Dormilich** · Apr 26 '12, 10:54 AM

I get a connection error with that.

**123123om** · Apr 26 '12, 11:10 AM

hi dormilich,

https://10.140.1.193:8090/OfficeInfo/Weather.html

this is how m getting dynamic weather data as expected but in description field i need to add image based on weather condition as if its cloudy or sunny etc
here is my code after modification

Code:

var desc = response.getElementsByTagName("desc").item(0).firstChild?response.getElementsByTagName("desc").item(0).firstChild.data : "";
if(desc == "Cloudy")
{
alert("cloudy");
document.querySelector("#desc").innerHTML = '<img src="images/cloudy.gif" alt="">';          $("input#desc").val(response.getElementsByTagName("desc").item(0).firstChild?response.getElementsByTagName("desc").item(0).firstChild.data : ""); 
}

Code:

					
<li>
<div id="desc">
<label for="desc"><span class="required">Description</span></label>
<input id="desc" name="desc"  type="text" class="text required"  disabled="disabled"/>
</div>
</li>

i am new to javascript,i would appreciate your more help, pls help me.

**Dormilich** · Apr 26 '12, 11:13 AM

does it work?

**123123om** · Apr 26 '12, 11:13 AM

that is the link for my web page which is after entering the ZIP code which shows details of weather forecast

**123123om** · Apr 26 '12, 11:14 AM

does it work?
no still not working where to use div tag to define id as i am using label tag to define and input tag to get datas dynamically

**Dormilich** · Apr 26 '12, 11:16 AM

a little bit more information besides "still not working" would be incredibly helpful.

**123123om** · Apr 26 '12, 11:19 AM

by using

Code:

document.getElementById("test").innerHTML = '<img src="pic.png" width="200" height="100" alt="a demo picture">';

its not navigating the page and not displaying the image as well and other details are displaying normally

**Dormilich** · Apr 26 '12, 11:23 AM

above code would require you to actually have an element with the ID of "test" …

and why should it navigate the page (whatever that is supposed to mean*) at all?

* - you can navigate a ship or a vehicle (if you get what I mean)

how to add image based on if condition in JavaScript

how to add image based on if condition in JavaScript

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment