كيف أستطيع أن أحقن العنصر باستعمال appendChild?

Mohamed Lamin Mahmoudi · 6 أغسطس 2022

عندما أستعمل append يتم حقن العنصر في صفحة html

لكن عندما أستعمل 

appendChild d
يظهر خطأ  

Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

ملف js

ipcRenderer.on('AddName-AndAge',function(e,item){
   let Age=item[1];
   let name=item[0];
   window.localStorage.setItem('name',name);
   window.localStorage.setItem('Age',Age);
   let AgeMaladie=document.createTextNode(Age);
   let nameMaladie=document.createTextNode(name);
   let infoMal=`Nom de Maladie :${name}
               Age de Maladie :${Age}`;
   
   let maladieInfo=document.querySelector('#Maladie-info');
   let z=document.createElement('p');
   z.appendChild(infoMal);
   maladieInfo.appendChild(z);
 });

html

 <div class="maladie-side clearfix">
                <button type="button" id="ajouter" class="btn btn-primary py-2 ajouter float-left">
                    Ajouter un maladie
                  <!-- <a href="./maladieData.html">
                  </a> -->
              </button>
              <span id="Maladie-info" class="Maladie_Info text-left ">
                 
                  
              </span>
            </div>

Wael Aljamal · 6 أغسطس 2022

أولاً حاول قراءة وفهم رسالة الخطأ، أنت تحاول حقن عنصر ضمن عنصر آخر، لكنه يرفض ذلك ويخبرك أن العنصر هذا infoMal ليس عقدة أي ليس div مثلاً أو body. بل هو نص عادي string.

أي سيعمل append أما appendChild خاص بالعقد وسوم HTML

z لديك عبارة عن وسم P ويبدو أنك ترغب في إسناد قيمة النص infoMal له وهذا يتم من خلال innerHTML فهو الأفضل لهذه الحالة.

z.innerHTML = infoMal;

باقي الشيفرة ليس بها خطأ

Adnane Kadri · 7 أغسطس 2022

طريقة أخرى لحقن النص ضمن العنصر المستهدف هي في انشاء عقدة Node محتواها النصي هو السلسلة النصية التي نحاول حقنها.

فبدل:

let infoMal=`Nom de Maladie :${name}
               Age de Maladie :${Age}`;
   
..
let z=document.createElement('p');
z.appendChild(infoMal);

مباشرة، نقوم بانشاء عنصر span مثلا ونحقنه الى العنصر المستهدف:

let infoMal=`Nom de Maladie :${name}
               Age de Maladie :${Age}`;
   
..
let z=document.createElement('p');
let infoMalContainer = document.createElement(infoMal);

// تحديد نص للعنصر
infoMalContainer.textContent = infoMal;

// حقن الحاوي
z.appendChild(infoMalContainer);

يمكن ايضا استعمال التابع createTextNode لتحويل السلسلة النصية المحصل عليها الى عقدة Node يمكن حقنها الى موضع في وثيقة HTML:

let infoMal=`Nom de Maladie :${name}
               Age de Maladie :${Age}`;
   
..
let z=document.createElement('p');
let infoMalContainer = document.createTextNode(infoMal);

// حقن العقدة
z.appendChild(infoMalContainer);

كيف أستطيع أن أحقن العنصر باستعمال appendChild?

السؤال

Mohamed Lamin Mahmoudi

رابط هذا التعليق

شارك على الشبكات الإجتماعية

2 أجوبة على هذا السؤال

Recommended Posts

Wael Aljamal

رابط هذا التعليق

شارك على الشبكات الإجتماعية

Adnane Kadri

رابط هذا التعليق

شارك على الشبكات الإجتماعية

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية