使用jQuery将html图像添加到div / table

Question

i'm new to JQuery and currently using it in Visual Studio 2013.

I want to ask how do I add img tag into a table or div using JQuery?

Ie. i have a div and i want to dynamically create image using jquery. OR i have a dynamically created table in a dynamically created div, and I want to add an image to one of its row.

I've tried this in jsfiddle ( http://jsfiddle.net/3C7UD/1/ )

$("#divid").append('<table>
                      <tr>
                        <td>asdasdasd</td>
                        <td><img src:"https://www.google.com/images/srpr/logo11w.png"  width:"225px" height:"225px" /></td>
                        </tr>
                     </table>');

$('#divid').append('<img src:"' + imgLink + '"  width:"225px" height:"225px" />');

but no image.. I also have tried that in visual studio project but the same (no image).

I can't found any tutorial about adding image, and the solutions I found in this forum haven't work for me by far....

Answer 1

You wrote <img src:"..." /> instead of <img src="..." /> which is the reason why your code isn't showing the image:

Corrected fiddle : http://jsfiddle.net/Zword/3C7UD/3/

Corrected part of code:

$("#divid").append('<table><tr><td>asdasdasd</td><td><img src="http://blog.sckyzo.com/wp-content/google-small.png"  width:"225px" height:"225px" /></td></tr></table>');
$('#divid').append('<img src="' + imgLink + '"  width:"225px" height:"225px" />');

Answer 2

HTML attributes are specified with = , not : .

$("#divid").append('<table><tr><td>asdasdasd</td><td><img src="http://blog.sckyzo.com/wp-content/google-small.png"  width="225px" height="225px" /></td></tr></table>');
$('#divid').append('<img src="' + imgLink + '"  width="225px" height="225px" />');

Updated demo: http://jsfiddle.net/3C7UD/5/

Answer 3

try changing this 2 lines:

var img = "<img src='"+imgLink+"' />";

and the last one:

$('#divid').append(img);

Answer 4

Change your code to :

$("#divid").append('<table>
                  <tr>
                    <td>asdasdasd</td>
                    <td><img src:"https://www.google.com/images/srpr/logo11w.png"   style="width:225px; height:225px" /></td>
                    </tr>
                 </table>');

$('#divid').append('<img src:"' + imgLink + '"  style = "width:225px;height:225px" />');

Answer 5

Change your:

><img src:"

to

><img src="