ما هو الفرق بين  attribute  و  property؟

يمكن ايجاد الفرق بين عنصري property وّ attribute في برمجة الويب، خصوصا عند التحدث عن DOM.

بخصوص property يمكن الحصول على قيم مختلف الخصائص properties المتعلقة بوسوم html، حيث نحصل على أنواع مختلف من القيم: boolean، string...  من خلال استعمال خاصية prop علىjQuery كما هو موضح أسفله:

لديناوسم الرابط
<a href='page2.html' class='link classes' name='linkName' id='linkID'>Hi</a>
 property لاستخراج قيم jQueryعند استعمال كود

$('#linkID').prop('href'); // returns "http://example.com/page2.html"
$('#linkID').prop('name'); // returns "linkName"
$('#linkID').prop('id'); // returns "linkID"
$('#linkID').prop('className'); // returns "link classes"

يمكن تغيير و تحديث قيم Prop من خلال jQuery بواسط الكود:

<a href='page2.html'>Hi</a>

$('#linkID').prop('href', 'page1.html');
$('#linkID').prop('href'); // returns "http://example.com/page1.html"

بالنسبة لـattribute تتعلق بلغة html اكثر منDOM، ويمكن ملاحظة الفرق مع خاصية property من خلال الكود التالي:

<input type="checkbox" checked=true/>

$('input').prop('checked'); // returns true
$('input').attr('checked'); // returns "checked"

تتميز خاصية attribute بحفاظها على القيم الافتراضية التي أخذها الوسم (default value)، ويمكن اعتبارها ميزة في بعض  الأحيان، كما قد تعطي القيمة الخطأ للمبرمج في حين تم تحيين قيمة الوسم، كمثال لذلك:

<input type="text" name="username" value="user123">

$('input').prop('value', '456user');
$('input').prop('value'); // returns "456user"
$('input').attr('value'); // returns "user123"