ما هو دوم؟ DOM هي مجموعة من واجهات API تعتمد على برمجة المتصفح (في هذا البرنامج التعليمي ، يمكن القول أنها برمجة DHTML). W3C لديه بعض الاختلافات الدقيقة في كل متصفح. من بينها ، متصفح Mozilla هو الأكثر تشابهًا مع المعيار. يجب أن تجمع JavaScript البسيط بين DOM لأداء برمجة DHTML ، ويمكن أن تنتج تأثيرات جميلة وتطبيقها على الويب. هذا هو نفسه تقريبًا مثل اللغات الأخرى ، تمامًا كما يتطلب C/C ++ دعم المكتبة. خلاف ذلك ، إنه مجرد بحث نحوي. ما نشعر به الأكثر اهتمامًا هو أن DOM يربط صفحات الويب مع البرامج النصية ولغات البرمجة الأخرى. ينتمي DOM إلى المتصفح ، وليس المحتوى الأساسي المحدد في مواصفات لغة JavaScript.
ابحث عن العناصر
1. ابحث مباشرة
| اسم الطريقة | يصف |
| getElementByid (id) (وثيقة) | احصل على عناصر في المستند مع قيمة سمة معرف فريدة محددة |
| getElementsbyTagname_R (الاسم) | إرجاع مجموعة من عناصر الأطفال مع tagname المحددة في العنصر الحالي |
| document.getElementsByClassName | احصل على مجموعة العلامات بناءً على السمات |
| getAttribute (الاسم) | إرجاع قيمة السمة للعنصر ، يتم تحديد السمة بالاسم |
1> document.getElementByid ('id')
<Body> <div id = "zhang"> ليس وسيمًا </div> <script type = "text/javaScript"> var i = document.getElementById ('Zhang') ؛ // ابحث عن المعرف المحدد I.InnerText = 'وسيم جدًا' ؛ // innertext تعديل السلسلة المحددة </script> </body>تأثير العرض ، عندما نفتح IE ، سيتم تعديله ليكون وسيمًا جدًا.
2> getElementsbyTagname_R (الاسم)
<Body> <div name = "Zhang"> ليس وسيمًا </div> <script type = "text/javaScript"> var i = document.getElementByTagnmae ('Zhang') ؛ // ابحث عن اسم الاسم المحدد I.InnerText = 'وسيم جدًا' ؛ // innertext تعديل السلسلة المحددة </script> </body>نفس تأثير العرض
3> document.getElementsByClassName
<Body> <viv> ليس وسيمًا </div> <script type = "text/javaScript"> var i = document.getElementClassName ('Zhang') ؛ // ابحث عن اسم الفئة المحدد I.InnerText = 'وسيم جدًا' ؛ // innertext تعديل السلسلة المحددة </script> </body>2. البحث غير المباشر
| اسم السمة | يصف |
| الأطفال | يعيد مجموعة من جميع عناصر الأطفال للعنصر الحالي |
| الأطفال | يعيد جميع عناصر الأطفال للعنصر الحالي |
| Firstchild | إرجاع أول عنصر الطفل السفلي للعنصر الحالي |
| LastChild | يعيد العنصر الأخير للطفل من العنصر الحالي |
| Nextsibling | إرجاع العنصر مباشرة بعد العنصر الحالي |
| السابق | إرجاع العنصر الذي يسبق العنصر الحالي مباشرة |
| الوالدين | تُرجع عنصر تسمية العقدة الأصل |
| أطفال | أعد كل ترجماتها |
| FirstElementChild | يعيد العنصر الفرعي الأول |
| LastElementChild | إرجاع العنصر الفرعي الأخير |
| Nextelementtsibling | العودة下一个兄弟标签元素 |
| السابق | العودة إلى عنصر علامة الأخوة السابق |
مع W3C DOM ، يمكنك كتابة البرامج النصية للمستعرضات المتقاطعة البسيطة ، والاستفادة الكاملة من قوة ومرونة XML لاستخدام XML كوسيلة اتصال بين المتصفح والخادم.
عناصر التشغيل
1. خصائص W3C DOM والطرق المستخدمة لإنشاء المحتوى ديناميكيًا
| الخصائص/الأساليب | يصف |
| document.createlement_x (tagname) | يمكن للطريقة CreateElement_X على كائن المستند إنشاء عناصر محددة بواسطة TagName. إذا تم استخدام السلسلة DIV كمعلمة الطريقة ، فسيتم إنشاء عنصر DIV |
| document.createTextNode (نص) | ستقوم طريقة CreateTextNode لكائن المستند بإنشاء عقدة تحتوي على نص ثابت. |
| <Element> .appendchild (childnode) | تضيف طريقة AppendChild العقدة المحددة إلى قائمة عقدة الطفل الحالية للعنصر الحالي (كعقدة طفل جديدة). |
| <Element> .SetAttribute (الاسم ، القيمة) | هذه الطرق على التوالي الحصول على قيمة السمة في العنصر وتعيينها على التوالي |
| <Element> .insertbefore (NewNode ، TargetNode) | أدخل Node NewNode كعقدة طفل للعنصر الحالي أمام عنصر NORDENODE |
| <element> .RemoVeatTribute (اسم) | هذه الطريقة تحذف اسم السمة من العنصر |
| <Element> .RemoveChild (ChildNode) | هذه الطريقة تزيل نود الطفل عنصر الطفل من العنصر |
| <element> .replacechild (NewNode ، Oldnode) | هذه الطريقة تحل محل العقدة القديمة مع Node NewNode |
| <element> .haschildnodes () | تقوم هذه الطريقة بإرجاع قيمة منطقية تشير إلى ما إذا كان العنصر لديه عناصر الطفل |
2. TAG COTATION
innertext احصل على محتوى نص العلامة innerhtml احصل على قيمة محتوى HTML احصل على القيمة ، أي قيمة النموذج المقدم
هذا هو ، ما يلي ما يلي:
<viv> 1111 </viv> <viv> 2222 </viv> <type type = "text" value = "zhang yanlin"> <script> document.getElementSbyClassName ("Zhang"). InnerText = 123 ؛ // احصل على العلامة باسم الفصل Zhang وقم بتغيير المحتوى إلى 123 document.getElementSbyClassName ("Yan"). innerhtml = 456 ؛ // احصل على العلامة باسم الفصل يان وقم بتغيير المحتوى إلى 456 document.getElementsByClassName ("Lin"). value = "Zhang Yanlin هو وسيم" ؛ // احصل على العلامة باسم الفصل Lin وتغيير المحتوى إلى Zhang Yanlin هو وسيم </script>3. سمات
السمات // الحصول على جميع سمات العلامة setAttribut
من خلال الخصائص المخصصة ، يمكنك جعل حالة اختيار كل شيء ، إلغاء تحديد ، وإلغاء تحديد. الرمز كما يلي:
<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> العنوان </title> </head> <body> <iv> <turny type = "butten" value = "select onclick =" checkall () ؛ value = "und enlect" onClick = "recvall () ؛"> </div> <div id = "i1"> <ul> <li> <li> checkall () {var b = document.getElementSbyClassName ("c1") ؛ لـ (var i = 0 ؛ i <b.length ؛ i ++) {var check = b [i] ؛ check.checked = true}} cancleall () {var b = document.getElementSbyClassName ("c1") ؛ لـ (var i = 0 ؛ i <var i = 0 ؛ i <b.Length ؛ i ++) {var check = b [i] ؛ check.checked = false}} function recvall () {var b = document.getElementSbyClassName ("c1") ؛ لـ (var i = 0 ؛ i <b.length ؛ i ++) {var check = b [i] ؛ if (check.checked) {check.checked = false} آخر {check.checked = true}}} </script> </body> </html> حدد الكل ، عكس ، حالات إلغاء.ملاحظة: OnClick هو حدث نقرة ، والذي سيتم ذكره لاحقًا
4. العملية الفصل
classname // الحصول على جميع أسماء الفصول الدراسية rald.remove (CLS) // حذف قائمة الفئة المحددة
هذا الشيء مفيد جدا. على سبيل المثال ، في jd.com ، عندما يتم وضع الماوس لدينا على جميع المنتجات ، تظهر العديد من المنتجات أدناه. تم إخفاء المنتجات وتظهر فقط بعد الحدث المشغل هو تحديد سمة CSS المخفية. بعد وضع الماوس ، تتم إزالة السمة المخفية CSS ؛ تتم إزالة الماوس وإضافة السمة المخفية.
<! doctype html> <html> <head lang = "en"> <meta charset = "utf-8"> <title> إخفاء </title> <style> .hide {display: none ؛ } </style> </head> <body> <span onMouseover = "Mouover () ؛"> ضع شيئًا منه ، لكنه يختفي دون وضعه </span> <div id = "Zhangyanlin" style = "font-size: 60px"> Zhang Yanlin document.getElementById ("Zhangyanlin"). classlist.remove ("Hide") ؛ } وظيفة mouout () {document.getElementById ("Zhangyanlin"). classlist.add ("Hide") ؛ } </script> </body> </html> دعنا نستيقظ الدماغ بحالة5. علامة العلامة
يمكننا إنشاء علامات من خلال DOM وإضافتها إلى الموقع المحدد. فيما يلي طريقتان لتشغيل العلامات
// الطريقة واحدة var Zhang = "<input type = 'text' />" ؛ xxx.insertadjacenthtml("beforeelid"، zhang) ؛xxx.insertadjacentelement('afterbegin'.document.createElement('a ') // ملاحظة: الطريقة Two var tag = document.createElement ('div') xxx.appendchild (علامة) // إضافة عنصر div xxx.insertbefore (العلامة ، xxx [1]) // إدراج إلى الموضع المحدد ، يمكنك استخدام الفهرس <! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> العنوان </title> </head> <body> <viv> <viv> <type type = "text"/> <input type = "button" value = "add" onclick = "addElement (this) ؛" /> </div> <div style = "الموضع: النسبية ؛"> <ul id = "commentlist"> <li> alex </li> <li> eric </li> </ul> </viv> </viv> <script> function AddElement (ths) {// الحصول على قيمة الإدخال var val = ths.previouselementibling.value ؛ ths.previouselementibling.value = "" ؛ var commentList = document.getElementById ('CommentList') ؛ // النموذج الأول ، طريقة السلسلة // var str = "<li>" + val + "</li>" ؛ // 'preferbegin' ، 'Afterbegin' ، 'قبل "،' بعد الابتعاد" // قبل أن يكون داخليًا // قبل الجزء العلوي الخارجي // AfterBegin internal-fitting // بعد الالتزام الخارجي بالجدار الخارجي //commentlist.insertadjacenthtml("beforendis) ؛ // الطريقة الثانية هي طريقة العنصر var tag = document.createElement ('li') ؛ tag.innertext = val ؛ var temp = document.createElement ('a') ؛ temp.innertext = 'baidu' ؛ temp.href = "http://etiantian.org" ؛ tag.appendchild (temp) ؛ // commentlist.appendChild (tag) ؛ CommentList.InserTbefore (TAG ، COMMANTLIST.CHILDRN [1]) ؛ } </script> </body> </html> إضافة حالة تشغيل العلامة6. نمط التشغيل
<Body> <div id = i1> Zhang Yanlin هو وسيم </div> <script> var obj = document.getElementById ('i1') ؛ obj.style.fontsize = "32px" ؛ obj.style.backgroundcolor = "red"الآثار هي كما يلي:
لنأخذ قضية. مجرد النظر إلى نقاط المعرفة ممل. غالبًا ما نرى الخط الداكن في مربع الإدخال ، مما يطالبك بإدخال شيء ما. عند النقر فوق ، يختفي. إنها عملية سحرية. يتم تحقيقه من خلال دوم. فقط اقرأ الكود دون أن يقول الكثير من الهراء.
<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> العنوان </title> <style> .bb {color: #9a9a9a ؛ } .AA {color: Black ؛ } </style> </head> <body> <input value = "الرجاء إدخال المحتوى" onfocus = "inpatu (this) ؛" onblur = "onbtu (this) ؛"> <script> function inpatu (ths) {ths.className = "aa" ؛ var text = ths.value ؛ if (text == "الرجاء إدخال المحتوى") {ths.value = "" ؛ }} وظيفة onbtu (ths) {var text = ths.value ؛ if (text == "الرجاء إدخال المحتوى" || text.trim (). length == 0) {ths.className = "BB" ؛ ths.value = "الرجاء إدخال المحتوى" ؛ }} </script> </body> </html> موجه مربع الإدخال7. تشغيل الموقف
إجمالي وثيقة ارتفاع المستند المستند.
هل تعتقد أن هناك عودة إلى الجزء العلوي في الزاوية اليمنى السفلى من صفحة الويب ثم العودة إلى الأعلى على أدنى نقطة؟ نعم ، هو حساب هذه المرتفعات. وعندما تسحب الماوس ، سيتغير النمط المقابل لشريط القائمة على اليسار.
<! doctype html> <html> <head lang = "en"> <meta charset = "utf-8"> </itlem> </head> <style> body {margin: 0px ؛ } img {border: 0 ؛ } ul {padding: 0 ؛ الهامش: 0 ؛ على غرار القائمة: لا شيء ؛ } h1 {padding: 0 ؛ الهامش: 0 ؛ } .clearfix: بعد {content: "." ؛ العرض: كتلة ؛ الارتفاع: 0 ؛ واضح: كلاهما ؛ الرؤية: مخفية ؛ } .wrap {width: 980px ؛ الهامش: 0 Auto ؛ } .pg-header {background-color: #303a40 ؛ -webkit-box-shadow: 0 2px 5px rgba (0،0،0 ، .2) ؛ -moz-box-shadow: 0 2px 5px rgba (0،0،0 ، .2) ؛ box-shadow: 0 2px 5px rgba (0،0،0 ، .2) ؛ } .pg-header .logo {float: left ؛ Padding: 5px 10px 5px 0px ؛ . العرض: 110 بكسل ؛ الارتفاع: 40 بكسل ؛ } .PG-Header .Nav {Line-Height: 50px ؛ } .pg-header .Nav ul li {float: left ؛ } .pg-header .Nav ul li a {display: block ؛ اللون: #CCC ؛ الحشو: 0 20px ؛ تدمير النص: لا شيء ؛ حجم الخط: 14px ؛ } .pg-header .Nav ul li a: hover {color: #fff ؛ خلفية اللون: #425A66 ؛ . أعلى: 60px ؛ العرض: 200 بكسل ؛ خلفية اللون: #fafafa ؛ أسفل: 0px ؛ } .pg-body .catalog.fixed {الموضع: ثابت ؛ أعلى: 10 بكسل ؛ . خلفية اللون: #425A66 ؛ . أعلى: 60px ؛ العرض: 700 بكسل ؛ الهامش اليساري: 210 بكسل ؛ خلفية اللون: #fafafa ؛ الفائض: السيارات ؛ . الحدود: 1 بكسل صلب أحمر. } </style> <body onscroll = "scrollevent () ؛"> <viv> <viv> <viv> <a href = "#"> <img src = "http://core.pc.lietou-static.com/revs/images/common/logo_7012c4a4. href = "#"> home </a> </li> <li> <a href = "#"> الوظيفة 1 </a> </li> <li> <a href = "#" 1 </a> </div> <div auto-to = "function2"> <a> الصورة 2 </a> </viv> <div auto-to = "function3"> <a> الصورة 3 </a> </viv> </viv> <div id = "content"> <div menu = "function1" <div menu = "function3"> <h1> الفصل 3 </h1> </viv> </viv> </viv> </script> <script> function Scrollevent () {var bodyscrolltop = document.body.scrolltop ؛ if (bodyscrolltop> 50) {document.getElementSbyClassName ('catalog') [0] .classlist.add ('fixed') ؛ } آخر {document.getElementSbyClassName ('catalog') [0] .classlist.remove ('fixed') ؛ } var content = document.getElementById ('content') ؛ أقسام var = content.children ؛ لـ (var i = 0 ؛ i <sections.length ؛ i ++) {var current_section = sections [i] ؛ // الارتفاع المطلق للتسمية الحالية من top var scofftop = current_section.offsettop + 60 ؛ // التسمية الحالية من الأعلى ، الارتفاع النسبي var offtop = scofftop - bodyscrolltop ؛ // ارتفاع التسمية الحالي var height = current_section.scrollheight ؛ if (OffTop <0 && -offtop <height) {// تضيف التسمية الحالية النشط // إزالة أخرى من قوائم var النشطة = document.getElementById ('catalog'). الأطفال ؛ var current_menu = قوائم [i] ؛ current_menu.classlist.add ('نشط') ؛ لـ (var j = 0 ؛ j <menus.length ؛ j ++) {if (menus [j] == current_menu) {} else {menus [j] .classlist.remove ('active') ؛ } } استراحة؛ }}}} </script> </body> </html> قائمة التمرير <! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> العنوان </title> <style> .pg-top {position: fixed ؛ لون الخلفية: #0095BB ؛ الارتفاع: 40 بكسل ؛ العرض: 40 بكسل ؛ أسفل: 50 بكسل ؛ اليمين: 40 بكسل ؛ اللون: Whitesmoke. } .hide {display: none ؛ } </style> </head> <body onscroll = "func () ؛"> <div style = "height: 3000px ؛" id = "i1"> <h1> Zhang Yanlin </h1> </viv> <div id = "i2"> <a href = "javaScript: void (0) ؛" onClick = "gotop () ؛"> العودة إلى الأعلى </a> </viv> <script> وظيفة func () {var scrolltop = document.body.scrolltop ؛ var i1 = document.getElementById ("i2") ؛ if (scrolltop> 20) {i1.classlist.remove ("Hide")} آخر {i1.classlist.add ("Hide")}} وظيفة gotop () {document.body.scrolltop = 0 ؛ } </script> </body> </html> العودة إلى الأعلى8. العمليات الأخرى
Console.log الإخراج مربع مربع التنبيه المربع المنبثق تأكيد تأكيد التأكيد مربع // url و refresh
دعني أخبرك عن المؤقت. المؤقت أكثر فائدة. على سبيل المثال ، عندما نحذف رسالة بريد إلكتروني ، سنجد محادثة منبثقة. تم حذف البريد الإلكتروني. هذا مؤقت واحد. يمكن استخدام مؤقت متعدد عندما يكون لديك احتياجات محددة.
// حالة توقيت متعددة <type type = "button" value = "interal" onClick = "interal () ؛"> <input type = "button" value = "stopInterval" onClick = "StopInterval () ؛ S1 = setInterval (function () {console.log (123)} ، 500) ؛ } وظيفة stopInterval () {clearinterval (s1) ؛ // قم بمسح مؤقت متعدد} </script>مؤقت واحد
<div> <type type = "button" value = "delete" onClick = "delete () ؛ T1 = setTimeOut (ClearStatus ، 1500) ؛ } وظيفة clearStatus () {document.getElementById ("الحالة"). innertext = "" ؛ } وظيفة undelete () {clearTimeOut (t1) ؛ // بعد مسح المؤقت ، سوف يستمر في العرض} </script>حدث
<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> العنوان </title> </head> <body> // الحدث العادي <button id = "btn1" onClick = "func () ؛ دالة Func () {Alert ("معالجة الوقت العادية")} </script> // المستوى 0 حدث المعالجة <button ID = "BTN2"> زر معالجة المستوى 0 </button> <script> var btn = document.getElementById ("btn2") ؛ btn.onclick = function () {Alert ("زر معالجة المستوى 0")} ؛ // btn.onclick = null ؛ // Clear Processing Event ، سيتم كتابة أحداث متعددة بشكل مفرط ، تاركًا الحدث الأخير فقط </script> // المستوى 2 حدث المعالجة <button id = "btn3"> زر معالجة المستوى 2 </button> <script> var btn = document.getElementById ("BTN3"). AddEventListener ("Click" ، function () var btn1 = document.getElementById ("btn3"). addEventListener ("Click" ، function () {Alert ("Secondary Processing Event 2")}) ؛ // غير مكتوبة فوق </script> <button id = "btn4"> زر متوافق كامل </button> <script> var btn = document.getElementById ("btn4") ؛ if (btn.addeventListener) {btn.addeventListener ("Click" ، Demo) ؛ } آخر إذا (btn.attachevent) {btn.attachevent ("onClick" ، demo) ؛ } آخر {btn.onclick = demo ؛ } دالة Demo () {Alert ("معالجة أحداث التوافق المدمجة")} </script> </body> </html>قائمة الأحداث:
| ملكية | متى يحدث هذا الحدث (عندما يتم تشغيل) |
| onabort | تم مقاطعة تحميل الصور |
| Onblur | العنصر يفقد التركيز |
| onchange | تم تعديل محتوى المنطقة |
| onclick | يسمى مقبض الحدث عندما ينقر المستخدم على كائن (تنفيذ مثال الرمز أعلاه عند النقر فوق علامة الإدخال) |
| ondblclick | مقبض الحدث يسمى عندما ينقر المستخدم المزدوج على كائن |
| onerror | حدث خطأ أثناء تحميل مستند أو صورة |
| onfocus | العناصر تكتسب التركيز |
| Onkeydown | يتم الضغط على مفتاح لوحة المفاتيح |
| onkeypress | يتم الضغط على مفتاح لوحة المفاتيح وإطلاقه |
| onkeyup | تم إصدار لوحة مفاتيح |
| onload | يتم تحميل صفحة أو صورة |
| onmousedown | يتم الضغط على زر الماوس |
| onMousemove | بعد تحرك الماوس |
| onMouseout | تتم إزالة الماوس من عنصر |
| onMouseover | حرك الماوس فوق عنصر |
| onMouseup | يتم إصدار زر الماوس |
| onreset | يتم النقر على زر إعادة الضبط |
| onresize | تم تغيير حجم النافذة أو الإطار |
| onselect | النص المحدد |
| onsubmit | يتم النقر على زر التأكيد |
| onunload | صفحة خروج المستخدم |
ملاحظة: يمكن لعلامة ربط أحداث متعددة ، تعمل هذه العلامة حاليًا ، ويغلف الحدث محتوى الحدث الحالي.
دعنا نواجه بعض الحالات ، وإلا أشعر أنني لم أرها بعد قراءتها
<! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> العنوان </title> <style> ul {style: none ؛ الحشو: 0 ؛ الهامش: 0 ؛ } ul li {float: Left ؛ خلفية اللون: #038CAE ؛ اللون: أبيض. الحشو: 15px 20px ؛ } .clearfix: بعد {Display: Block ؛ محتوى: '.'؛ الارتفاع: 0 ؛ الرؤية: مخفية ؛ واضح: كلاهما ؛ } .hide {display: none ؛ } .tab-menu {border: 1px solid #dddddd ؛ } .tab-menu .title {background-color: #ddddd ؛ . اللون: أسود. أعلى الحدود: 2 بكسل الصلب الأحمر. . MINIight: 150px ؛ } </style> </head> <body> <viv> <viv> <viv> <ul> <li target = "h1" onClick = "show (this) ؛"> Trends 3/li> <li target = "h2" onClick = "show (this) ؛ "content"> <div con = "h1"> content1 </viv> <div con = "h2"> content2 </viv> <div con = "h3"> content3 </viv> </viv> </viv> </viv> </viv> </viv> </viv> </viv> <script> show (ths) ths.className = 'active' ؛ var brother = ths.parentElement.children ؛ لـ (var i = 0 ؛ i <brother.length ؛ i ++) {if (ths == brother [i]) {} else {brother [i] .RemoVeatTribute ("class") ؛ }} var content = document.getElementById ("المحتوى"). الأطفال ؛ لـ (var j = 0 ؛ j <content.length ؛ j ++) {var current_content = content [j] ؛ var con = current_content.getattribute ("con") ؛ if (con == target) {current_content.classlist.remove ("Hide") ؛ } آخر {current_content.className = "Hide" ؛ }}}} </script> </body> </html> حالة قائمة العلامة <! doctype html> <html lang = "en"> <head> <meta charset = "utf-8"> <title> العنوان </title> </head> <body> <input type = "button" onClick = "func () ؛" value = "Click Me"/> <div id = "i1"> <viv> 123 </viv> <div allex = "sb"> 123 </viv> <viv> 123 </viv> <div alex = "sb"> 123 </viv> <div> 123 </viv> <!-<type type = "text"- func () {// i1 // i1 all children ، oop كل طفل ، تحكم إذا alex = 'sb' var i1 = document.getElementById ('i1') ؛ var divs = i1.children ؛ لـ (var i = 0 ؛ i <divs.length ؛ i ++) {var current_div = divs [i] ؛ var result = current_div.getAttribute ('Alex') ؛ // console.log (نتيجة) ؛ if (result == "sb") {current_div.innertext = "456" ؛ }}} </script> </body> </html> تغيير قيم العناصر من خلال سمات مخصصةالمقالة أعلاه لها فهم عميق لكائنات JavaScript DOM. هذه المقالة هي كل المحتوى الذي أشاركه معك. آمل أن تتمكن من إعطائك مرجعًا وآمل أن تتمكن من دعم wulin.com أكثر.