Event Listeners event listener ያለውን እያንዳንዱን አካል ይዘረዝራል፣ በአይነት ቀለም - ጠቅታ፣ አንዣብብ፣ ሸብልል፣ ንካ፣ የቁልፍ ሰሌዳ እና ቅጽ - እያንዳንዱ ተቆጣጣሪ ከየት እንደመጣ ያሳያል፣ እና DOM ሲቀየር አባሎችን ብልጭ ድርግም ይላል።
የሆነ ነገር ለምን ምላሽ እንደሚሰጥ - ወይም እንደማይሰራ ማወቅ - ብዙውን ጊዜ የሚጀምረው ገጹ በማይመልስ ጥያቄ ነው፡ በዚህ ኤለመንት ላይ ጠቅታ ተቆጣጣሪ አለ? የማንዣበብ ባህሪው የትኛው አካል ነው? ማሸብለል ማዳመጥ እና ገጹን መንተባተብ የሚያደርገው ምንድን ነው? Browser DevTools የትኛውን አካል እንደሚመርጡ አስቀድመው ካወቁ የአንድን ንጥረ ነገር listeners በአንድ ጊዜ ሊዘረዝር ይችላል።
ይህ መሳሪያ ለጠቅላላው ገጽ ጥያቄውን በአንድ ጊዜ ይመልሳል. እያንዳንዱ listener ያለው አካል በዓይነቱ ቀለም - ጠቅታ፣ አንዣብብ፣ ሸብልል፣ ነካ እና ጎትት፣ ኪቦርድ፣ ወይም ቅጽ እና ትኩረት - እና አንዱን ማንዣበብ ትክክለኛውን ክስተቶች እና እያንዳንዱ ከየት እንደመጣ ያሳያል፡ የውስጠ-መስመር ባህሪ፣ በንብረት ላይ ያለ፣ React ወይም Vue ተቆጣጣሪ፣ jQuery ወይም addEventListener ። የምድብ ሰቆች እያንዳንዱን አይነት ማብራት እና ማጥፋት ይቀይራሉ፣ እና ከስር ያለው ዝርዝር እያንዳንዱን አካል ይሰይማል፣ ስለዚህ አንድ ጠቅታ ወደ እሱ ያሸብልልዎታል።
ማዕቀፎች በትክክል ይያዛሉ. React listeners ከሥሩ ጋር በማያያዝ እና ክስተቶችን ከውስጥ ይልካቸዋል፣ ይህም አፕሊኬሽኑ በሙሉ ጠቅ ሊደረግ የሚችል ይመስላል። መሣሪያው እነዚያን የስር ምዝገባዎች ወደ ጎን ያስቀምጣቸዋል እና የ React ተቆጣጣሪዎችን በሚያውጁ ንጥረ ነገሮች ላይ ያሳያል። ፈጣን ቅኝቱ ዳግም መጫን አያስፈልገውም እና የመስመር ውስጥ ተቆጣጣሪዎችን ይሸፍናል, React, Vue እና jQuery. መሣሪያው ከመከፈቱ በፊት በግልጽ addEventListener የተጨመሩ Listeners የሚታዩት ከገጽ ጭነት መጀመሪያ ጀምሮ ብቻ ነው፣ ስለዚህ Reload & record ገጹን አንዴ በመቅዳት እንደገና ይጭናል - መሳሪያው እያንዳንዱን listener በማካተት፣ በገጽ ደረጃ ያሉትን window እና document ጭምር ይከፈታል።
ሁለተኛው ትር DOM እራሱን ይመለከታል። እያንዳንዱ የተጨመረ ወይም የተወገደ መስቀለኛ መንገድ፣ የባህሪ ለውጥ እና የጽሁፍ ለውጥ በገጹ ላይ ብልጭ ድርግም ይላል፣ ቆጣሪዎቹ በሰከንድ ሚውቴሽን ያሳያሉ፣ እና ዝርዝሩ ከተካተቱት ባህሪያት ጋር በጣም የሚለወጡትን ንጥረ ነገሮች ደረጃ ይይዛል። ማንም ገፁን የማይነካው ቋሚ ዥረት ማለት ሰዓት ቆጣሪ፣ ጃቫ ስክሪፕት የሚመራ አኒሜሽን ወይም ማዕቀፍ ከሚገባው በላይ እንደገና የሚሰራ ነው - በትክክል ባትሪዎችን የሚያሟጥጡ እና ገጾች እንዲንተባተቡ የሚያደርጉ ነገሮች።
ጠቅታ፣ ማንዣበብ፣ ማሸብለል፣ ንካ፣ ኪቦርድ እና ቅጽ listeners ያላቸው አካላት እያንዳንዱን ዓይነት ለማሳየት ወይም ለመደበቅ በየራሳቸው ቀለም ተዘርዝረዋል።
የመስመር ውስጥ ባህሪያት፣ በንብረቶች ላይ፣ React እና Vue ተቆጣጣሪዎች፣ jQuery ክስተቶች እና addEventListener ጥሪዎች፣ በእያንዳንዱ ኤለመንት ላይ የተሰየሙ።
React የስር ደረጃ listeners ወደ ጎን ተቀምጠዋል፣ እና ተቆጣጣሪዎቹ ከመላው መተግበሪያ ይልቅ እነሱን በሚያውጁ ንጥረ ነገሮች ላይ ይታያሉ።
Reload & record ከገጽ ጭነት መጀመሪያ ጀምሮ window document listeners ጨምሮ ለዚያ አንድ ጭነት ብቻ እያንዳንዱን addEventListener ጥሪ ይይዛል።
የተጨመሩ እና የተወገዱ አንጓዎች፣ የባህሪ ለውጦች እና የጽሁፍ ለውጦች በገጹ ላይ ብልጭ ድርግም የሚሉ፣ ሚውቴሽን በሰከንድ ቆጣሪ።
በጣም የሚለወጡ የንጥረ ነገሮች ዝርዝር፣ ከተካተቱት ባህሪያት ጋር፣ ወደ ሽሽት ድጋሚ ስራዎች በቀጥታ ይጠቁማል።
አንድ አዝራር በእርግጥ listener እንዳለው፣ ወይም ተቆጣጣሪው በምትኩ መጠቅለያ ላይ መቀመጡን በጨረፍታ ይመልከቱ።
window እና document ላይ listeners ጨምሮ ማሸብለል፣ ጎማ ወይም ንክኪ የሚያዳምጥ እያንዳንዱን አካል ያግኙ።
ለቁልፍ ሰሌዳ ዝግጅቶች የትኞቹ መቆጣጠሪያዎች ምላሽ እንደሚሰጡ እና ለመዳፊት ብቻ ምላሽ እንደሚሰጡ ያረጋግጡ።
ገጹ ስራ ፈት እያለ የሚውቴሽን ቆጣሪውን ይመልከቱ; ነጥቡን ወደ ሰዓት ቆጣሪ ወይም ማዕቀፍ የሚቀይሩ ንጥረ ነገሮች ተጨማሪ ስራን የሚሰሩ።
የትኛዎቹ ክፍሎች በይነተገናኝ እንደሆኑ እና የትኛዎቹ ማዕቀፍ እንደገመዳቸው ለማየት በማያውቁት ጣቢያ ዙሪያ ያንዣብቡ።
በ DevSuite Pro dock ውስጥ ያለውን Event Listeners አዶን ጠቅ ያድርጉ። ፈጣን ቅኝት ወዲያውኑ ይሰራል እና ያገኘውን እያንዳንዱን አካል ይዘረዝራል።
ክስተቶቹን እና ምንጮቹን ለማየት ማንኛውንም የተዘረዘረ አካል አንዣብብ። ጠቅታ፣ ማንዣበብ ወይም ሸብልል listeners ብቻ ለማሳየት የምድብ ሰቆችን ተጠቀም።
ዳግም Reload & record ገጹን አንዴ ከቀረጻ ጋር እንደገና ለመጫን ቅረጽ። መሣሪያው በራሱ እንደገና ይከፈታል እና አሁን እያንዳንዱን addEventListener ጥሪ ያካትታል።
ገጹን ወደዚያ አካል ለማሸብለል እና ብልጭ ድርግም ለማድረግ በዝርዝሩ ውስጥ አንድ ረድፍ ጠቅ ያድርጉ። Copy report ሙሉውን ዝርዝር እንደ ጽሑፍ ይሰጥዎታል.
የ DOM mutations ትርን ይክፈቱ እና ገጹን ይጠቀሙ። ንጥረ ነገሮች ብልጭ ድርግም ይላሉ፣ እና በጣም ስራ የሚበዛባቸው ወደ ዝርዝሩ አናት ይወጣሉ።
DevSuite Pro ን በነፃ ይጫኑ እና 74+ የገንቢ መሳሪያዎችን ለአሳሽዎ ይክፈቱ።
