تدریس XML DOM

DOM چیست؟

DOM روش‌های استاندارد دسترسی و عملیات بر روی مستند را تعریف می‌کند:

“W3C Document Object Model (DOM) یک رابط مستقل از پلتفرم و زبان است که به برنامه‌ها و اسکریپت‌ها اجازه می‌دهد محتوای، ساختار و استایل مستند را به صورت دینامیک دسترسی پیدا کنند و به‌روزرسانی کنند.”

HTML DOM روش‌های استاندارد دسترسی و عملیات بر روی مستند HTML را تعریف می‌کند. آن مستند HTML را به صورت ساختار درختی نمایش می‌دهد.

XML DOM روش‌های استاندارد دسترسی و عملیات بر روی مستند XML را تعریف می‌کند. آن مستند XML را به صورت ساختار درختی نمایش می‌دهد.

برای هر کسی که از HTML یا XML استفاده می‌کند، درک DOM ضروری است.

HTML DOM

تمام عناصر HTML می‌توانند از طریق HTML DOM دسترسی پیدا کنند.

مثال 1

اس مثال میں id="demo" کا HTML علامت کا ترمیم کرنا چاہتا ہے:

<h1 id="demo">یہ عنوان ہے</h1>
<script>
document.getElementById("demo").innerHTML = "Hello World!";
</script>

آزمایش کنید

مثال 2

اس مثال میں HTML دستاویز میں پہلے <h1> علامت کا ترمیم کرنا چاہتا ہے:

<h1>یہ عنوان ہے</h1>
<h1>یہ عنوان ہے</h1>
<script>
document.getElementsByTagName("h1")[0].innerHTML = "Hello World!";
</script>

آزمایش کنید

توجہ:اگرچہ HTML دستاویز صرف ایک <h1> علامت کا حامل ہو، آپ کو بھی شمارہ [0] کا استعمال کرنا چاہیے، کیونکہ getElementsByTagName() طریقہ ہمیشہ ایک شمارہ درج کراتا ہے。

آپ کرسکی سکتے ہیں کہ HTML DOM کا بارے میں مزید معلومات JavaScript تعلیم میں جائیں。

XML DOM

تمام XML علامات XML DOM کے ذریعے دستیاب ہوتے ہیں。

XML DOM یہ ہے:

  • XML کا معیاری آئی-موڈل
  • XML کا معیاری پروگرامنگ انٹرفیس
  • پلیٹ فارم اور زبان سے مستقل
  • W3C معیار

یعنی: XML DOM یہ معیار ہے جو XML علامت کا حصول، ترمیم، اضافہ یا حذف کرنے کا طریقہ بيان کرتا ہے。

XML علامت کا ترمیم کرنا

اس مثال میں XML دستاویز میں پہلے <title> علامت کا متن کا ترمیم کرنا چاہتا ہے:

مثال

txt = xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;

XML فائل لوڈ کرنا

اس مثال میں استعمال کیا جانے والا XML فائل books.xml ہے。

اس لیکسی 'books.xml' کو xmlDoc میں پڑھا اور books.xml میں پہلے <title> علامت کا متن کا ترمیم کرنا چاہتا ہے:

مثال

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
    myFunction(this);
    }
};
xhttp.open("GET", "books.xml", true);
xhttp.send();
function myFunction(xml) {
    var xmlDoc = xml.responseXML;
    document.getElementById("demo").innerHTML =
    xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
}
</script>
</body>
</html>

آزمایش کنید

توضیح مثال

  1. xmlDoc - شیء XML DOM ایجاد شده توسط پردازش‌گر
  2. getElementsByTagName("title")[0] - اولین علامت <title> را بدست آورید
  3. childNodes[0] - اولین نود فرزند <title> (نود متنی)
  4. nodeValue - مقدار نود (متن خود)

بارگذاری رشته XML

این مثال شامل بارگذاری یک رشته متنی به یک شیء XML DOM و استفاده از JavaScript برای استخراج اطلاعات از آن است:

مثال

<html>
<body>
<p id="demo"></p>
<script>
var text, parser, xmlDoc;
text = "<bookstore><book>" +
"<title>雅舍谈吃</title>" +
"<author>梁实秋</author>" +
"<year>2013</year>" +
"</book></bookstore>";
parser = new DOMParser();
xmlDoc = parser.parseFromString(text,"text/xml");
document.getElementById("demo").innerHTML =
xmlDoc.getElementsByTagName("title")[0].childNodes[0].nodeValue;
</script>
</body>
</html>

آزمایش کنید

رابط برنامه‌نویسی

DOM XML را به مجموعه‌ای از نود‌های شیء مدل‌سازی می‌کند. می‌توان از JavaScript یا زبان‌های برنامه‌نویسی دیگر برای دسترسی به نود‌ها استفاده کرد. در این آموزش از JavaScript استفاده می‌کنیم.

رابط برنامه‌نویسی DOM توسط مجموعه‌ای از ویژگی‌ها و روش‌های استاندارد تعریف شده است.

ویژگی‌هامعمولاً به معنای چیزی که چیست (مثلاً nodename است "book")

روش‌هامعمولاً به معنای آنچه می‌توان انجام داد (مثلاً حذف عمل "book")

ویژگی‌های XML DOM

این‌ها برخی از ویژگی‌های معمول DOM هستند:

  • x.nodeName - نام x
  • x.nodeValue - مقدار x
  • x.parentNode - نود والد x
  • x.childNodes - نود‌های فرزند x
  • x.attributes - نود ویژگی‌های x

تعلیمات:در لیست بالا، x یک شیء نود است.

XML DOM کی طریق

  • x.getElementsByTagName(نام) - اپنے نشان نام کی تمام عناصر کو حاصل کریں
  • x.appendChild(نود) - x میں ایک ذیلی نود داخل کریں
  • x.removeChild(نود) - x سے ذیلی نود کو حذف کریں

تعلیمات:عنصر کی اس فہرست میں،x یک نود آئیٹی ہے۔