jQuery ডিভ ট্যাগ ভিতরে চিত্র যোগ করুন


154

আমার একটি ডিভ ট্যাগ আছে

<div id="theDiv">Where is the image?</div>

আমি ডিভের ভিতরে একটি চিত্র ট্যাগ যুক্ত করতে চাই

শেষ ফলাফল:

<div id="theDiv"><img id="theImg"  src="theImg.png" />Where is the image?</div>

উত্তর:


301

আপনি কি নিম্নলিখিত চেষ্টা করেছেন:

$('#theDiv').prepend('<img id="theImg" src="theImg.png" />')

10
আমি উপরে জোসে বাসিলিওর কাছে প্রতিক্রিয়া জানাতে পারি না (পর্যাপ্ত প্রতিনিধি নয়) তবে "চিত্রটি কোথায়?" এর পরে সংযোজন এটি এনে দেবে। প্রিপেন্ড আগে রাখবে।
টোফার ফ্যাঙ্গিও

4
আমি আপনাকে প্রিপেন্ড ব্যবহার করার জন্য উপগ্রহ করতে চলেছিলাম, কিন্তু আমি লক্ষ্য করেছি যে আপনি আপনার নির্বাচকটিতে '#' মিস করছেন ...
বেন কোহলার

1
আমি বন্দুকটি এপেন্ড করে লাফিয়ে উঠলাম। ভালো বল ধরা. +1
হোসে বাসিলিও

কমপক্ষে আমার কোডে appendTo কাজ করে না ... আমি এই থ্রেডটি পোস্ট করার আগেও jQuery ডক্স পৃষ্ঠায় পড়ার পরে এটি ব্যবহার করা ঠিক ছিল না।
PositiveGuy

চিত্র ট্যাগ যুক্ত করার জন্য .append () এবং .html () চেষ্টা করেছিলেন, তবে <img> ট্যাগটি উত্সটির সাথে সঠিকভাবে উপস্থিত হলেও চিত্র লোড হচ্ছে না। এই সম্পর্কে কোন পরামর্শ?
অনূপগৌদার

52

আমার 2 সেন্ট:

$('#theDiv').prepend($('<img>',{id:'theImg',src:'theImg.png'}))

this ('<img>') ব্যবহারের এই উত্তরটি আমার পছন্দ হয়েছে, এটি সন্ধান করছিল।
ব্যবহারকারী 734028

আপনার কাছে $ পর বৈশিষ্ট্যাবলী জুড়তে পারেন ( '<চিত্র') ATTR ( 'আইডি', 'theImg') ATTR ( 'src',
স্কট


10

<div>ফাংশনটি যখনই image()ডাকা হয় তখনই আমরা যদি ট্যাগের বিষয়বস্তু পরিবর্তন করতে চাই তবে আমাদের এটি করতে হবে :

জাভাস্ক্রিপ্ট

function image() {
    var img = document.createElement("IMG");
    img.src = "/images/img1.gif";
    $('#image').html(img); 
}

এইচটিএমএল

<div id="image"></div>
<div><a href="javascript:image();">First Image</a></div>

1
আমি আপনাকে কিছু ব্যাখ্যা যোগ করার পরামর্শ দিচ্ছি।
অল্টার

1
আমরা যখন <div> ট্যাগের সামগ্রীটি পরিবর্তন করতে চাই, যখনই ফাংশন চিত্র () বলা হবে। আমাদের এই / ফাংশন চিত্রের মতো করতে হবে () im var img = document.createElement ("IMG"); img.src = "/images/img1.gif"; $ ( '# ইমেজ') HTML (চিত্র)। div <ডিভিডি আইডি = "চিত্র"> </div> <ডিভ> <a href="javascript:image(); "> প্রথম চিত্র </a> </div>
মনজিৎ কুমার

6

মনজিৎ কুমারের পোস্ট ছাড়াও (তাঁর কোনও ঘোষণা ছিল না)

var image = document.createElement("IMG");
image.alt = "Alt information for image";
image.setAttribute('class', 'photo');
image.src="/images/abc.jpg";
$(#TheDiv).html(image);

2
var img;
for (var i = 0; i < jQuery('.MulImage').length; i++) {
                var imgsrc = jQuery('.MulImage')[i];
                var CurrentImgSrc = imgsrc.src;
                img = jQuery('<img class="dynamic" style="width:100%;">');
                img.attr('src', CurrentImgSrc);
                jQuery('.YourDivClass').append(img);

            }
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.