الفرق بين المراجعتين ل"JavaScript/ParentNode/children"
(مراجعتان متوسطتان بواسطة مستخدم واحد آخر غير معروضتين) | |||
سطر 8: | سطر 8: | ||
===القيمة=== | ===القيمة=== | ||
− | القيمة المُعادة عبارة عن كائن من النّوع <code>HTMLCollection</code> والذي هو مجموعة حيّة ومُرتّبة من عناصر DOM الذين هم أولاد العقدة. يُمكنك الوصول إلى العقد الأولاد كل على حدة في المجموعة عبر استعمال إمّا التّابع <code>item()</code> على المجموعة أو باستعمال طريقة | + | القيمة المُعادة عبارة عن كائن من النّوع <code>HTMLCollection</code> والذي هو مجموعة حيّة ومُرتّبة من عناصر DOM الذين هم أولاد العقدة. يُمكنك الوصول إلى العقد الأولاد كل على حدة في المجموعة عبر استعمال إمّا التّابع <code>item()</code> على المجموعة أو باستعمال [[JavaScript/Property Accessors|طريقة الوصول]] إلى المصفوفات في JavaScript. |
إن لم يكن للعُقدة أية عناصِرَ أولاد، فستكون القائمة <code>children</code> فارغة بقيمة طول <code>length</code> تُساوي <code>0</code>. | إن لم يكن للعُقدة أية عناصِرَ أولاد، فستكون القائمة <code>children</code> فارغة بقيمة طول <code>length</code> تُساوي <code>0</code>. | ||
سطر 21: | سطر 21: | ||
==إضافة لدعم المتصفحات غير المدعومة == | ==إضافة لدعم المتصفحات غير المدعومة == | ||
− | الشيفرة التّالية تقوم بالكتابة فوق الكائن <code>children</code> الذي يُعتبر كائنا من النّوع <code>prototype</code> وتُضيف دعم كلّ من <code>Document</code> و<code>DocumentFragment</code> لمُتصفّحي IE9 وSafari. لكنّها | + | الشيفرة التّالية تقوم بالكتابة فوق الكائن <code>children</code> الذي يُعتبر كائنا من النّوع <code>prototype</code> وتُضيف دعم كلّ من <code>Document</code> و<code>DocumentFragment</code> لمُتصفّحي IE9 وSafari. لكنّها تعيد مصفوفةً عوضًا عن مجموعة من النّوع <code>HTMLCollection</code>. |
<syntaxhighlight lang="javascript"> | <syntaxhighlight lang="javascript"> | ||
سطر 47: | سطر 47: | ||
!الميزة | !الميزة | ||
!|Chrome | !|Chrome | ||
− | + | !Edge | |
!Firefox | !Firefox | ||
!Internet Explorer | !Internet Explorer | ||
سطر 61: | سطر 61: | ||
|4 | |4 | ||
|- | |- | ||
− | !الدعم على كلّ من | + | !الدعم على كلّ من Document وDocumentFragment (ميّزة تجريبيّة) |
|29 | |29 | ||
|؟ | |؟ | ||
سطر 69: | سطر 69: | ||
|لا | |لا | ||
|- | |- | ||
− | ! الدعم على | + | ! الدعم على SVGElement (ميّزة تجريبيّة) |
|نعم | |نعم | ||
|لا | |لا | ||
سطر 84: | سطر 84: | ||
==مصادر ومواصفات== | ==مصادر ومواصفات== | ||
− | * مواصفة [ | + | * مواصفة [https://dom.spec.whatwg.org/#dom-parentnode-children DOM]. |
[[تصنيف:JavaScript]] | [[تصنيف:JavaScript]] |
المراجعة الحالية بتاريخ 02:45، 18 مارس 2018
تُعيد الخاصيّة children
القابلة للقراءة فقط والمُعرّفة على الواجهة ParentNode
كائنا من النّوع HTMLCollection
الذي يحتوي على جميع العناصِرِ الأولاد الخاصّة بالعقدة التي استُدعَت عليها.
البنية العامة
var children = node.children;
القيمة
القيمة المُعادة عبارة عن كائن من النّوع HTMLCollection
والذي هو مجموعة حيّة ومُرتّبة من عناصر DOM الذين هم أولاد العقدة. يُمكنك الوصول إلى العقد الأولاد كل على حدة في المجموعة عبر استعمال إمّا التّابع item()
على المجموعة أو باستعمال طريقة الوصول إلى المصفوفات في JavaScript.
إن لم يكن للعُقدة أية عناصِرَ أولاد، فستكون القائمة children
فارغة بقيمة طول length
تُساوي 0
.
مثال
var foo = document.getElementById('foo');
for (var i = 0; i < foo.children.length; i++) {
console.log(foo.children[i].tagName);
}
إضافة لدعم المتصفحات غير المدعومة
الشيفرة التّالية تقوم بالكتابة فوق الكائن children
الذي يُعتبر كائنا من النّوع prototype
وتُضيف دعم كلّ من Document
وDocumentFragment
لمُتصفّحي IE9 وSafari. لكنّها تعيد مصفوفةً عوضًا عن مجموعة من النّوع HTMLCollection
.
;(function(constructor) {
if (constructor &&
constructor.prototype &&
constructor.prototype.children == null) {
Object.defineProperty(constructor.prototype, 'children', {
get: function() {
var i = 0, node, nodes = this.childNodes, children = [];
while (node = nodes[i++]) {
if (node.nodeType === 1) {
children.push(node);
}
}
return children;
}
});
}
})(window.Node || window.Element);
دعم المتصفحات
الميزة | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
الدعم الأساسي | 1 | نعم | 3.5 | 9 | 10 | 4 |
الدعم على كلّ من Document وDocumentFragment (ميّزة تجريبيّة) | 29 | ؟ | 25 | لا | 16 | لا |
الدعم على SVGElement (ميّزة تجريبيّة) | نعم | لا | نعم | لا | ؟ | لا |
انظر أيضًا
- الواجهة
ParentNode
والواجهةChildNode
- أنواع الكائنات التي تُطبّق هذه الواجهة:
Document
وElement
وDocumentFragment
Node.childNodes
مصادر ومواصفات
- مواصفة DOM.