43 lines
1.6 KiB
Markdown
43 lines
1.6 KiB
Markdown
|
---
|
||
|
|
title: HTML Dom
|
||
|
|
localeTitle: HTML دوم
|
||
|
|
---
|
||
|
|
## HTML دوم
|
||
|
|
|
||
|
|
باستخدام HTML DOM ، تستطيع JavaScript الوصول إلى جميع عناصر مستند HTML وتغييرها.
|
||
|
|
|
||
|
|
عندما يتم تحميل صفحة ويب ، يقوم المتصفح بإنشاء **D** ocument **O** bject **M** odel للصفحة.
|
||
|
|
|
||
|
|
يتم إنشاء نموذج HTML DOM كشجرة من الكائنات:
|
||
|
|
|
||
|
|
كل عنصر في DOM يسمى أيضًا عقدة.
|
||
|
|
|
||
|
|
`
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title> My title </title>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<a href="#">My Link</a>
|
||
|
|
<h1> My header </h1>
|
||
|
|
</body>
|
||
|
|
</html>
|
||
|
|
`
|
||
|
|
|
||
|
|
يكون DOM الخاص بـ HTML أعلاه على النحو التالي:
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
باستخدام نموذج الكائن ، تحصل جافا سكريبت على جميع الطاقة اللازمة لإنشاء HTML ديناميكي:
|
||
|
|
|
||
|
|
* تستطيع JavaScript تغيير جميع عناصر HTML في الصفحة
|
||
|
|
* يمكن لـ JavaScript تغيير جميع سمات HTML في الصفحة
|
||
|
|
* تستطيع جافا سكريبت تغيير جميع أنماط CSS في الصفحة
|
||
|
|
* يمكن لجافا سكريبت إزالة عناصر وسمات HTML الموجودة
|
||
|
|
* يمكن أن تضيف JavaScript عناصر وسمات HTML جديدة
|
||
|
|
* يمكن أن تتفاعل JavaScript مع جميع أحداث HTML الموجودة في الصفحة
|
||
|
|
* تستطيع JavaScript إنشاء أحداث HTML جديدة في الصفحة
|
||
|
|
|
||
|
|
#### معلومات اكثر:
|
||
|
|
|
||
|
|
[W3C - HTML DOM](https://www.w3schools.com/js/js_htmldom.asp)
|