জাভাস্ক্রিপ্ট / জিকুয়েরিতে এইচটিএমএল উপাদান উপাদানগুলি ক্লোন করা সম্ভব?

Question

আমি কীভাবে আমার সমস্যা সমাধান করবেন সে সম্পর্কে কিছু টিপস সন্ধান করছি।

আমার একটি টেবিলে একটি এইচটিএমএল উপাদান রয়েছে (যেমন নির্বাচন বাক্স ইনপুট ক্ষেত্র)। এখন আমি অবজেক্টটি অনুলিপি করতে চাই এবং অনুলিপিটির বাইরে একটি নতুন তৈরি করতে চাই এবং এটি জাভাস্ক্রিপ্ট বা jQuery সহ। আমি মনে করি এটি কোনওভাবে কাজ করা উচিত তবে আমি এই মুহুর্তে কিছুটা নিখুঁত।

এর মতো কিছু (সিউডো কোড):

oldDdl = $("#ddl_1").get(); 

newDdl = oldDdl;

oldDdl.attr('id', newId);

oldDdl.html();

Comments

stackoverflow.com/search?q=jquery+copy+element+content সম্পর্কিত একগুচ্ছ প্রশ্ন রয়েছে।

— ফেলিক্স ক্লিং

Answer 1

আপনার কোড ব্যবহার করে আপনি ক্লোননোড () পদ্ধতিটি ব্যবহার করে প্লেইন জাভাস্ক্রিপ্টে এর মতো কিছু করতে পারেন :

// Create a clone of element with id ddl_1:
let clone = document.querySelector('#ddl_1').cloneNode( true );

// Change the id attribute of the newly created element:
clone.setAttribute( 'id', newId );

// Append the newly created element on element p 
document.querySelector('p').appendChild( clone );

বা jQuery ক্লোন () পদ্ধতি ব্যবহার ( সবচেয়ে দক্ষ নয়):

$('#ddl_1').clone().attr('id', newId).appendTo('p'); // append to where you want

Comments

আপনি যখন কোনও উপাদান ক্লোন করেন তখন আইডিটি সংশোধন করা খুব গুরুত্বপূর্ণ।

— ড্রাগাগস ডুরলুট

Answer 2

নেটিভ জাভাস্ক্রিপ্ট সহ:

newelement = element.cloneNode(bool)

যেখানে বুলিয়ান শিশু নোডগুলি ক্লোন করতে হবে কিনা তা নির্দেশ করে।

এখানে MDN- র সম্পূর্ণ ডকুমেন্টেশন রয়েছে ।

Comments

সেরা উত্তর. যেখানে আপনার এটির দরকার নেই সেখানে জিকুরি ব্যবহার করবেন না।

— লুশ্ন

দেখতে দুর্দান্ত ... তবে ব্রাউজারের সামঞ্জস্যতা আজও প্রশ্নবিদ্ধ।

— অনিকেত সূর্যাবনশি

@ অ্যানিকেটসূর্যাবংশী আমি বিশেষত ৪ ফেব্রুয়ারি সম্পর্কে নিশ্চিত নই, তবে সামঞ্জস্যতা আজ নিখুঁত দেখাচ্ছে

আইডি এবং নামগুলি নকল করা হবে। আইডিগুলি পরিবর্তন করা দরকার, নামগুলি প্রত্যাশিত হলে নামগুলি যেমন রয়েছে তেমনই রেখে দেওয়া হবে।

— przemo_li

খুব খারাপ আপনি সমস্ত বৈশিষ্ট্য হারাবেন: /

— পিটার ডি বিয়

Answer 3

হ্যাঁ, আপনি একটি উপাদানের বাচ্চাদের অনুলিপি করতে এবং অন্য উপাদানগুলিতে এগুলি পেস্ট করতে পারেন:

var foo1 = jQuery('#foo1');
var foo2 = jQuery('#foo2');

foo1.html(foo2.children().clone());

প্রুফ: http://jsfiddle.net/de9kc/

Comments

সদৃশ আইডিগুলি আপনার পদ্ধতির সাথে একটি সমস্যা হবে

— przemo_li

Answer 4

এটি jQuery এ আসলে খুব সহজ:

$("#ddl_1").clone().attr("id",newId).appendTo("body");

অবশ্যই .appendTo () অবশ্যই পরিবর্তন করুন ...

Answer 5

আপনি একটি অনুলিপি তৈরি করতে ক্লোন () পদ্ধতি ব্যবহার করতে পারেন ..

$('#foo1').html( $('#foo2 > div').clone())​;

ছোট ছোট এখানে

Answer 6

এটা চেষ্টা কর:

$('#foo1').html($('#foo2').children().clone());

Answer 7

এক লাইনে:

$('#selector').clone().attr('id','newid').appendTo('#newPlace');

Comments

আমি মনে করি না যে এটির সাহায্য করবে কারণ আপনার বৈশিষ্ট্যটির মানটি এমন একটি স্ট্রিং যা পরিবর্তিত হবে না।

— জেমি আর রাইতলেস্কি

Answer 8

আপনার নির্বাচক হিসাবে আপনাকে "# foo2" নির্বাচন করতে হবে। তারপরে, এটি এইচটিএমএল () সহ পান।

এইচটিএমএল:

<div id="foo1">

</div>
<div id="foo2">
    <div>Foo Here</div>
</div>​

এখানে জাভাস্ক্রিপ্ট:

$("#foo2").click(function() {
    //alert("clicked");
    var value=$(this).html();
    $("#foo1").html(value);
});​

এখানে jsfiddle: http://jsfiddle.net/fritzdenim/DhCjf/