Έχει κανείς υπόψη κάποιο DOM Inspector για IE? Κάτι αντίστοιχο του Dom Inspector του Firefox?

Έχω δοκιμάσει το IE DOM Inspector αλλά δεν φτάνει το Firefox, κι ας είναι επί πληρωμή! Ψάχνω για ένα inspector που θα μου δείχνει και τα DOM attributes αλλά κυρίως το τελικό style ενός element (είναι αυτό που στο Firefox λέγεται computed style). Για όσους δεν το έχουν υπόψη, σου δείχνει ποιά style classes έχουν εφαρμοστεί σε ένα element (π.χ. ένα input) και ποιά attributes έχουν επηρεαστεί από το κάθε class.

Και το big wish! Να μπορούσα να καταλάβω και γιατί ένα style selector δουλεύει στο firefox αλλά όχι στον IE!

---

Παναγιώτης Καναβός, Freelancer
Twitter: http://www.twitter.com/pkanavos

Δεν έχω χρησιμοποιήσει DOM Inspector μέσα από τον IE ποτέ, όχι γιατί δεν τον χρειάστηκα αλλά γιατί όταν σηκωθεί το Visual Studio σαν Javascript Debugger για μια σελίδα είναι υπεραρκετός, καθαρότατη περίπτωση overkill. Μέσα από το View>Script Debugger>Open και στο dialog box που βγαίνει διαλέγεις μεταξύ του Script Editor (MS Office), του Visual Studio 2003 και του Visual InterDev, αν υπάρχει και αυτό εγκατεστημένο. Στο local window θα βρεις μέσα τα πάντα, style, currentStyle, runningStyle για αυτό το element που σε ενδιαφέρει - μπορείς να του δώσεις ένα ID για να το βρεις πιο εύκολα.

Όταν λες για style selector εννοείς μια κατάσταση σαν αυτή εδώ; Nikhil Kothari's Weblog. Έχει δυο κουμπάκια στο πάνω δεξί μέρος και αλλάζει stylesheet στην σελίδα δυναμικά.

Με το χάζεμα μου ήρθε μια ιδέα...

Επειδή πραγματικά είναι δύσκολο να μπορείς να δεις το δυναμικό source της σελίδας την ώρα που την θες, έφτιαξα κάτι σαν powertoy για τον IE.

Βαζει στο δεξί κλικ της σελίδας την επιλογή "Document DOM" και όταν επιλεγεί ανοίγει ένα παράθυρο και βγάζει color-coded το κώδικα της σελίδας με συμβολάκια [+], [-] για να μπορείς να ανοίγεις και να κλείνεις τα HTML elements και να βλέπεις το source. Παράλληλα αν κάνεις click στο όνομα ενός tag εμφανίζεται και ένα properties "παράθυρο" και δείχνει τις ιδιότητες του style object για αυτό το tag.

Είναι φτιαγμένο με DHTML οπότε για μια μεγάλη σελίδα, θέλει το χρόνο του για να κάνει render το DOM...

Αν θέλει κάποιος να το δοκιμάσει, είναι το συννημένο αρχείο. Το ανοίγει και κάνει δεξί click και επιλέγει Install από το μενού. Χρειάζεται κλείσιμο και άνοιγμα του IE για να το δει. Και παρατηρήσεις καλοδεχούμενες.

George J.

---

George J. Capnias: Χειροπρακτικός Υπολογιστών, Ύψιστος Γκουράρχης της Κουμπουτερολογίας w: capnias.org, t: @gcapnias, l: gr.linkedin.com/in/gcapnias

Ε? Local Window? Ποιό Local Window? Αν μιλάμε για το Local Window του debugger, αυτό είναι άδειο. Το ίδιο και τα properties. Το μόνο που δουλεύει στον debugger είναι το document outline. Πού τα βρήκες αυτά τα styles? Μήπως έχεις βάλει κανένα addin?

Όσο για το source της σελίδας, βάλε Firefox!

---

Παναγιώτης Καναβός, Freelancer
Twitter: http://www.twitter.com/pkanavos

pkanavos wrote:

Ε? Local Window? Ποιό Local Window? Αν μιλάμε για το Local Window του debugger, αυτό είναι άδειο. Το ίδιο και τα properties. Το μόνο που δουλεύει στον debugger είναι το document outline. Πού τα βρήκες αυτά τα styles? Μήπως έχεις βάλει κανένα addin?

Add-in στο Visual Studio Debugger; Θεός φυλάξει! Κρεμάς κουδούνια σε Porsche;

Δεν μου λες, έχεις κάνεις attach το thread και μετά κάνεις step-by-step debugging μέσα σε HTML και δεν έχει τίποτα μέσα στο local παράθυρο του debugger, μα τίποτα;

Μήπως θες, ένα "μικρό σπρώξιμο" με το Script Debugger;

pkanavos wrote:

Όσο για το source της σελίδας, βάλε Firefox!

(Σε replay) Θεός Φυλάξει!

Να βαλω browser ξέρουν ότι έχει security holes, και που το ξέρουν δεν κάνουν τίποτα εδώ και 3 μήνες;

Να βάλω browser που τα releases ανεβαίνουν πιο γρήγορα από αυτά των patches του Internet Explorer;

Και αυτό που κάνουν είναι να τσακώνονται με την Netscape, και να την βάζουν να αλλάζει kernel μέσα σε 24 ώρες από το επίσημο release του Netscape 8;
 
Και όταν παραπονέθηκε, τους απείλησαν ότι θα απαγορεύσουν την χρήση της μηχανής του FireFox από τρίτους browsers;

Μήπως η Netscape ήταν αυτή που χρηματοδότησε το Project Mozilla για να ξεκινήσει; Μήπως το Project Mozilla έχει "πάρει ψήλά τον αμανέ"; Μήπως κάνει αυτά που κατακρίνει στην Microsoft και στον Internet Explorer;

George J.

---

George J. Capnias: Χειροπρακτικός Υπολογιστών, Ύψιστος Γκουράρχης της Κουμπουτερολογίας w: capnias.org, t: @gcapnias, l: gr.linkedin.com/in/gcapnias

Μα απολύτως τίποτα. Εξάλλου τί step-by-step να κάνω στην HTML? Τα properties των elements θέλω να δω, όχι να βάλω breakpoint σε javascript

---

Παναγιώτης Καναβός, Freelancer
Twitter: http://www.twitter.com/pkanavos

Θες να κάνεις debug σε javascript.

Μόνο τότε δουλεύει o debugger. Πρέπει να κάνεις pause το thread, να δεις snapshot του DOM και να βρεις αυτό που θες.

George J.

---

George J. Capnias: Χειροπρακτικός Υπολογιστών, Ύψιστος Γκουράρχης της Κουμπουτερολογίας w: capnias.org, t: @gcapnias, l: gr.linkedin.com/in/gcapnias

Χρειάζομαι την βοήθειά σας αν γνωρίζετε!

ο παρακάτω κώδικας σε javascript φέρνει τα user defined tags μέσα από τα html elements (δες τα bolds),
το θέμα είναι ότι ενώ στο ie λειτουργεί κανονικά και επιστρέφει την τιμή item_data, στον firefox μου φέρνει αποτέλεσμα undefined

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
 <title>Untitled</title>
</head>
<script language='JavaScript'>
function btn_click() 
{  
alert(document.getElementById('row').item);
}
</script>
<body>
<table>
<tr id='row' item='item_data'>
<td>cell text</td>
</tr>
</table>
<br>
<input type='button' onclick='btn_click();' value='click me'>
</body>
</html>

 

diogenis wrote:

Χρειάζομαι την βοήθειά σας αν γνωρίζετε! ο παρακάτω κώδικας σε javascript φέρνει τα user defined tags μέσα από τα html elements (δες τα bolds), το θέμα είναι ότι ενώ στο ie λειτουργεί κανονικά και επιστρέφει την τιμή item_data, στον firefox μου φέρνει αποτέλεσμα undefined

Για δοκίμασε αυτό εδώ:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>
<title>Untitled</title>
</head>

<script language="JavaScript">
function btn_click() {  
 var demo=document.getElementById('row');
 var counter;
 for(counter=0; counter<demo.attributes.length; counter++){
  if (demo.attributes[counter].name=='item') {
   alert(demo.attributes[counter].value);
  }
 }
}
</script>
<body>

<form id="mainForm">
 <table>
  <tr id="row" item="item_data">
   <td>cell text</td>
  </tr>
 </table>
 <br>
 <input type="button" onclick="btn_click();" value="click me">
</form>

</body>

</html>

 

George J.

 

---

George J. Capnias: Χειροπρακτικός Υπολογιστών, Ύψιστος Γκουράρχης της Κουμπουτερολογίας w: capnias.org, t: @gcapnias, l: gr.linkedin.com/in/gcapnias

Σε ευχαριστώ gcapnias δούλεψε