কিভাবে প্রথম সন্তানের হিসাবে ডিওএম উপাদান সেট করবেন?

Question

আমার E ই উপাদান রয়েছে এবং আমি এতে কিছু উপাদান যুক্ত করছি। হঠাৎ করেই আমি জানতে পারি যে পরবর্তী উপাদানটি ই এর প্রথম সন্তান হওয়া উচিত? কৌশলটি কী, কীভাবে এটি করব? পদ্ধতি আনশিফ্ট কাজ করে না কারণ ই একটি বস্তু, অ্যারে নয়।

দীর্ঘ পথ হ'ল গর্তের ই বাচ্চাদের পুনরাবৃত্তি করা এবং কী ++ সরানো but তবে আমি নিশ্চিত যে একটি সুন্দর উপায় আছে।

Comments

আপনি ছেলেরা দ্রুত! আমি দুঃখিত, আমি মনে করি আমার ভুল বোঝাবুঝি হয়েছিল। উপাদান ই | - চাইল্ড-এল_1 | - চাইল্ড-এল_2 | - চাইল্ড-এল_3 এবং তারপরে চাইল্ড এল এল আসে ... যা প্রথম সন্তানের মতো ফিট হতে হবে। প্রিপেন্ড বাচ্চা-ই এল -৩ put [বি] ই [/ বি] এর আগে রাখবে, আমি কি ভুল এবং ক্লান্ত বা কি?

— পোপারা

Answer 1

var eElement; // some E DOM instance
var newFirstElement; //element which should be first in E

eElement.insertBefore(newFirstElement, eElement.firstChild);

Comments

আপনি আমার বন্ধু, স্রেফ আপনার ভালুক পেয়েছেন! দরকারী অতিরিক্ত সন্ধান। docs.jquery.com/Manipulation/insertBe पूर्व

— পোপারা

তথ্যের জন্য যদি পিতামাতার কোনও উপাদান না থাকে তবে বাচ্চাকে যেভাবেই যুক্ত করা হবে।

— নু

ফার্স্টচাইল্ডের ক্ষেত্রে টেক্সট নোড ব্যতিক্রম নিক্ষেপ করে। কিন্তু jquery প্রিপেন্ড dous না।

— সের্গেই সহকায়ান

@ সার্জি, ফায়ারফক্স এবং ক্রোমিয়ামে পরীক্ষিত নেক্সট নোড নিয়েও আমার পক্ষে কাজ করে। আপনি কোন ব্রাউজার ব্যবহার করেছেন? আপনি কি নিশ্চিত যে সমস্যাটি আপনার পক্ষে ছিল না? আপনি কি সমস্যাটি পুনরুত্পাদনকারী একটি স্নিপেট / জেএসফিল প্রস্তুত করার যত্ন নেবেন?

— ব্যবহারকারী

list.outerHTML = entry.outerHTML + list.outerHTML; আশা কাউকে সাহায্য করে।

— ডেনিজ পোরসুক

Answer 2

2017 সংস্করণ

তুমি ব্যবহার করতে পার

targetElement.insertAdjacentElement('afterbegin', newFirstElement)

এমডিএন থেকে :

InsertAdjacentElement () পদ্ধতিটি প্রদত্ত উপাদানটির সাথে সম্পর্কিত একটি নির্দিষ্ট অবস্থানে একটি প্রদত্ত উপাদান নোড সন্নিবেশ করায়।

অবস্থান
একটি ডিওএমএসস্ট্রিং উপাদানটির সাথে সম্পর্কিত অবস্থানের প্রতিনিধিত্ব করে; নিম্নলিখিত স্ট্রিংগুলির একটি হতে হবে
beforebegin: উপাদানটির আগে element
afterbegin: প্রথম সন্তানের ঠিক আগে, উপাদানটির ভিতরে।
beforeend: উপাদানটির অভ্যন্তরে, তার শেষ সন্তানের পরে।
afterend: উপাদান পরে নিজেই।

উপাদানটি
গাছটিতে beোকানো হবে।

এর পরিবারেও insertAdjacent ভাইবোন পদ্ধতি রয়েছে:

element.insertAdjacentHTML('afterbegin','htmlText')সরাসরি এইচটিএমএল স্ট্রিং ইনজেকশনের জন্য, পছন্দ মতো innerHTMLতবে সমস্ত কিছু ছাড়াই,document.createElement স্ট্রিং ম্যানিপুলেশন প্রক্রিয়াটির সাথে ঝাঁকুনির সাথে এমনকি সম্পূর্ণ কম্পোনেট তৈরি

element.insertAdjacentTextউপাদান স্যানিটাইজ স্ট্রিং ইনজেক্ট জন্য। আর নাencode/decode

Comments

দুর্দান্ত পরামর্শ কিন্তু "2017 এ ফিরে" কেন, এটি এমনকি

— আই

ধন্যবাদ। এবং অন্য একটি আপনার অন্তর্দৃষ্টি জন্য ধন্যবাদ। শিরোনামটি লোকদের দ্রুত পার্থক্য করতে সহায়তা করার জন্য এটি নতুন উত্তর

— পেরি মিমন

এলিমেন্ট = ডকুমেন্ট.আইপোর্টনোড (ডকুমেন্টফ্রেগমেন্ট, ট্রু) হলে কী হবে?

— মার্টিন মিজার

যে রিটার্ন elementটাইপ document-fragmentযে না insertAdjacent...()। আমাদের কাছে আরও ভাল উত্তর না পাওয়া পর্যন্ত আপনার সেরা অনুমানটি হ'ল এটিকে যুক্ত fragmentকরা div। আপনার ডোম Range.selectNodeContents()Range.extractContents()

— হেরফের

যেখানে 'উপাদান' হল সেই উপাদানটি যেখানে আপনি যুক্ত করতে চান এবং 'উপাদান' হ'ল উপাদানটি আপনি যুক্ত করতে চান;)

— বোকি

Answer 3

2018 সংস্করণ

parentElement.prepend(newFirstChild)

এটি আধুনিক জেএস! এটি পূর্ববর্তী বিকল্পগুলির চেয়ে বেশি পঠনযোগ্য। এটি বর্তমানে ক্রোম, এফএফ এবং অপেরাতে উপলব্ধ।

পিএস আপনি সরাসরি স্ট্রিংগুলি প্রেন্ড করতে পারেন

parentElement.prepend('This text!')

developer.mozilla.org

ন্ন - 2020 সালের 94%

Polyfill

Comments

দুর্দান্ত সমাধান, ধন্যবাদ! এটি আমাকে বিরক্ত করে যে তারা সিদ্ধান্ত নিয়েছে একটি শিশুকে শেষের দিকে যুক্ত করা .appendChild()তবে এটি শুরুতে যুক্ত করা .prepend().prependChild()

— অধিবেশনকে আঁকড়ে ধরে

append()পাশাপাশি বিদ্যমান, একইভাবে কাজ করে prepend()তবে শেষ পর্যন্ত

— গিবল্ট

আমি যখন এই প্রশ্নগুলি বাস্তবায়ন সম্পর্কে জিজ্ঞাসা করতে দেখেছি তখন আমি বিভ্রান্ত হয়ে পড়েছিলাম যখন আমি দেখলাম prependযে এটি ইতিমধ্যে ছিল। :( ঠিক আছে, এটি অতীতে ছিল না

— রিক করুন

Answer 4

আপনি এটিকে সরাসরি প্রয়োগ করতে পারেন আপনার সমস্ত উইন্ডো এইচটিএমএল উপাদান।
এটার মত :

HTMLElement.prototype.appendFirst=function(childNode){
    if(this.firstChild)this.insertBefore(childNode,this.firstChild);
    else this.appendChild(childNode);
};

Comments

prependপ্রোটোটাইপের প্রয়োজন ছাড়াই ভ্যানিলা জেএস সমতুল্য। এটি ES7- এ মানক হবে, এবং আপনার আবেদনের জন্য সম্ভব হলে আপনার ব্যবহার করা উচিত

— গিবল্ট

Answer 5

গৃহীত উত্তর একটি ফাংশনে রিফ্যাক্টর:

function prependChild(parentEle, newFirstChildEle) {
    parentEle.insertBefore(newFirstChildEle, parentEle.firstChild)
}

Comments

পিতামাতার সন্তানের সম্পর্ক ব্যবহারের জন্য +1। গৃহীত উত্তরের অভাব রয়েছে। eElementএটি বোঝার জন্য আমার কী প্রয়োজন তা জানতে হবে। এবং তার জন্য, আমার প্রশ্নটি পড়া দরকার। বেশিরভাগ সময়, আমি কেবল শিরোনাম পরীক্ষা করি এবং প্রশ্নের বিবরণ উপেক্ষা করে সরাসরি উত্তরে যাই।

— আকিনুরি

Answer 6

যদি না আমি ভুল বুঝে থাকি:

$("e").prepend("<yourelem>Text</yourelem>");

অথবা

$("<yourelem>Text</yourelem>").prependTo("e");

যদিও এটি আপনার বিবরণ থেকে মনে হচ্ছে কিছু শর্ত সংযুক্ত রয়েছে, তাই

if (SomeCondition){
    $("e").prepend("<yourelem>Text</yourelem>");
}
else{
    $("e").append("<yourelem>Text</yourelem>");
}

Comments

$ সংস্করণের জন্য +1! আমি একটি jQuery প্রসারিত ফানক লিখছি, তাই আমি যখনই পারফরম্যান্সের কারণে পারি না কেন নেটিভ সংস্করণটি ব্যবহার করব, তবে এটি নিখুঁত!

— টেলর ইভানসন

না, তিনি জাভাস্ক্রিপ্ট খুঁজছেন, জ্যাকোয়ারি নয়।

— ভিনিল

Answer 7

আমি আপনি যা খুঁজছেন মনে .prepend jQuery মধ্যে ফাংশন। উদাহরণ কোড:

$("#E").prepend("<p>Code goes here, yo!</p>");

Comments

আপনি ছেলেরা দ্রুত! আমি দুঃখিত, আমি মনে করি আমার ভুল বোঝাবুঝি হয়েছিল। উপাদান ই | - চাইল্ড-এল_1 | - চাইল্ড-এল_2 | - চাইল্ড-এল_3 এবং তারপরে চাইল্ড এল এল আসে ... যা প্রথম সন্তানের মতো ফিট হতে হবে। প্রিপেন্ড বাচ্চা-ই এল -৩ put [বি] ই [/ বি] এর আগে রাখবে, আমি কি ভুল এবং ক্লান্ত বা কি?

— পোপারা

Answer 8

আমি এই প্রোটোটাইপটি প্যারেন্ট উপাদানগুলিতে উপাদানগুলি প্রিপেন্ড করতে তৈরি করেছি।

Node.prototype.prependChild = function (child: Node) {
    this.insertBefore(child, this.firstChild);
    return this;
};

Answer 9

var newItem = document.createElement("LI");       // Create a <li> node
var textnode = document.createTextNode("Water");  // Create a text node
newItem.appendChild(textnode);                    // Append the text to <li>

var list = document.getElementById("myList");    // Get the <ul> element to insert a new node
list.insertBefore(newItem, list.childNodes[0]);  // Insert <li> before the first child of <ul>

https://www.w3schools.com/jsref/met_node_insertbefore.asp