Script errors in Internet Explorer. Causes and methods of elimination

While working on the Internet, the Internet Explorer browser can issue messages that the page contains errors and can be displayed incorrectly. Consider several ways to correct this problem.

Instruction

  • If there are no visible difficulty in the browser other than a periodically appearing error, you can try to disable the script debugging so that the message does not appear anymore (if the error appears not on one, but immediately on multiple sites, go to the next step). In the "Service" menu, open the Observer Properties item, select the "Advanced" tab and check the "Pre-debug scripting debugging" checkbox. If you need to disable the alert about all errors, uncheck the check box for the "Show notification about each script error".
  • Try to open the site when viewing an error occurs from another account or from another computer to find out whether the problem is local. If the error appears, most likely, it is caused by the wrong web page code. In this case, you can turn off the debugging of the scripts, following the instructions in the previous step. If when viewing the site using another computer or account, the problem disappears, go to the next step.
  • Perhaps Internet Explorer browser at the time of viewing the pages does not block active scripts, Java and ActiveX, which define the display of information on the page. To correct the problem, you need to reset the browser security settings. To do this, in the "Service" menu, select "Observer Properties" and go to the Safety tab. Click the Default button and then "OK". If, after re-running the page on which an error occurred, the problem remains, try the following method.
  • As you know, the browser stores temporary files and copies of pages in a separate folder, for subsequent circulation. If the folder sizes become too large, errors may occur when some pages are displayed. The problem can be solved, periodically cleaning the folder with temporary files. To do this, open the Observer Properties dialog box from the "Service" menu. On the General tab, in the History group, click the Delete button. Check the check boxes for "Internet temporary files", "Cookies", "Log", "Website data" and click "OK".
  • While working on the Internet, the Internet Explorer browser can issue messages that the page contains errors and can be displayed incorrectly. Consider several ways to correct this problem.

    Instruction

  • If there are no visible difficulty in the browser other than a periodically appearing error, you can try to disable the script debugging so that the message does not appear anymore (if the error appears not on one, but immediately on multiple sites, go to the next step). In the "Service" menu, open the Observer Properties item, select the "Advanced" tab and check the "Pre-debug scripting debugging" checkbox. If you need to disable the alert about all errors, uncheck the check box for the "Show notification about each script error".
  • Try to open the site when viewing an error occurs from another account or from another computer to find out whether the problem is local. If the error appears, most likely, it is caused by the wrong web page code. In this case, you can turn off the debugging of the scripts, following the instructions in the previous step. If when viewing the site using another computer or account, the problem disappears, go to the next step.
  • Perhaps Internet Explorer browser at the time of viewing the pages does not block active scripts, Java and ActiveX, which define the display of information on the page. To correct the problem, you need to reset the browser security settings. To do this, in the "Service" menu, select "Observer Properties" and go to the Safety tab. Click the Default button and then "OK". If, after re-running the page on which an error occurred, the problem remains, try the following method.
  • As you know, the browser stores temporary files and copies of pages in a separate folder, for subsequent circulation. If the folder sizes become too large, errors may occur when some pages are displayed. The problem can be solved, periodically cleaning the folder with temporary files. To do this, open the Observer Properties dialog box from the "Service" menu. On the General tab, in the History group, click the Delete button. Check the check boxes for "Internet temporary files", "Cookies", "Log", "Website data" and click "OK".
  • There are, of course, and others - I will definitely mention them.

    Firebug for Firefox

    I do not know for sure whether Firebug. The progenitor of other means for developers, but it is definitely the most popular, convenient and functional to date.

    Firebug is an addition for Firefox, which means it should be downloaded from the Firefox Add-ONS website and install.

    In order to call the firebug, it is enough to press F12.

    Opportunities for this add-on:

    • Inspection and editing of dynamically changing HTML;
    • Editing CSS on the fly;
    • Debugging JavaScript, command line to execute scripts;
    • Network query monitoring - you can see the size and time of downloading files and scripts, query headers;
    • DOM analyzer.

    You can tell a long time about these opportunities in the details, but I think they are known to all our readers, and if not - there is detailed information on the homebag home page or the same in the translation of Ilya Cantor.

    In addition to Firebug'a, you can use a useful row to it - Firecookie.With which (surprise :-) can be viewed and changed cookies.

    Web Developer Toolbar for Firefox

    Another useful addition to the fire. It looks like this:

    We will examine on points.

    Disable

    Allows you to turn off JavaScript, prohibit the use of cache, which is very useful when developing (allows you to be sure that the page booted along with the latest updates), cancel the colors used on the page and replace them with standard, prohibit the departure in the referrer header (the page with which was the transition ).

    Cookies.

    Useful option for working with cookies: they can be viewed, deleted, prohibit and add.

    CSS.

    This menu stores the cooled feature of Developer Toolbar - editing CSS on the fly. In addition, it is possible to view CSS, prohibit, and so on, and the like. In my opinion, here is very useful for the presence of fast keys (Ctrl + Shift + C, for example, allows you to immediately go to view page styles)

    Forms.

    All for work with forms: Show passwords, show information about forms, convert form methods (get "POST and vice versa) and much more. Useful Function "Populate Form Fields" to automatically fill in form fields (for example, when testing the site, when the password memorization feature is disabled. For the rest, I do not see anything useful at this point.

    Images

    There is a useful feature of disabling images - to see what your site looks like without pictures. Pictures can be circled, show their size, show ALT attributes.

    Information

    This menu has a lot of options. You can be a useful feature of displaying attributes Class and ID on the page. In addition, the item "View Color Information" is interesting - to quickly get information about the colors that are used on the page. VIEW Document Size - View page size. "View Response Headers" - view page headings.

    Miscellaneous.

    The most commonly used feature is cache cleaning. In addition, the functions "Page Ruler" - a line, "Page Magnifier" - magnifier and "Line Guides" - several lines that can be useful to push the pattern.

    Outline

    Allocation of different elements of the page - tables, headers, links, frames, blocks. Resize allows you to change the size of the browser window for any standard screens extensions. Tools Here are the features to validate pages. Both local and external. Convenient and quick access to HTML, CSS validation, and other things. For HTML validation, you can use CTRL + SHIFT + H clause.

    View Source.

    View source code. Ability to view in an external application, viewing the generated code.

    What is in the right corner I like most. This is a quick HTML Validator, CSS and JavaScript Error Indicator. If there are no problems - green icon, and if there are problems - red.

    Internet Explorer Developer Toolbar

    Starting with 8.0 debug errors, it is already built into this browser. It is easily called by key F12. True, he is poor as a program of the 90s.

    But there is a cooler tool for this browser, the so-called Internet Explorer Developer Toolbar downloads by reference.

    With the form of this Tulbar, of course, looks like Firebug, but, alas, I have not yet Doros. Although, on the other hand, there are some opportunities that there are no firebug. I would call the Internet Explorer Developer Toolbar to a certain hybrid Firebug'a and Firefox Web Developer. Toolbar.

    As in Firebug, there is an opportunity to inspect the element by simple click. But, if we can immediately see Padding'i and Margin, then there is no such opportunity.

    In addition, Internet Explorer Developer Toolbar does not update the elements tree dynamically, as Firebug does. That is, if we change anything on the JS fund page, we will not see anything with this Tulbara.

    From what can be rejected - change CSS on the fly (an easy way to find that hacking :), the ability to prohibit CSS and images, the ability to quickly clean the cache and play with cookies, quick access to validation.

    The most delicious thing is that there is a built-in Color Picker, which allows you to get any color from the piping. (For FF there is a separate COLORZILLA plugin).

    Debug Debugbar for Internet Explorer

    DEBUGBAR For Internet Explorer, you can download on the specified link.

    In its interesting expansion. Installed as an additional panel to the browser:

    There is a built-in search engine, a pipette, the ability to change the size of the window and, again, for some reason, the ability to send a page to a friend to soap. Although, it may be useful. But I could not take this opportunity.

    In addition, there is an inspector:

    The creation method by clicking or by the guidance of the developers did not suit: they came up with a piece more interesting. In Debugbar'e, you need to drag the sight on the desired item to see it in the tree. Ability to edit CSS no. But there is a validator and the built-in JS console.

    And if you want to dig in the settings, you can find it:

    And ridiculous and sad.

    It is known that in the eighth exploitor will be built in Developer Toolbar. He will be similar to the one that was described in the third point, but we hope that it will be better.

    DEBUG DRAGONFLY FOR OPERA

    Dragonfly is built into the opera, starting with version 9.5, so it is not necessary to install. In order to activate the dragonflays go to tools → Advanced → Means for developers. And if in English, Tools → Advanced → Developer Tools.

    Immediately warn you that Dragonfly is in the Alpha2 stage, this explains many of his glitches.

    List features:

    • DOM inspector;
    • An inspection by click (again, we will not see indents like in Firefox);
    • Editing;
    • Quick access to the error console.

    DF - Something like a separate page in Freme. If you opened it, it will be open to all tabs (unlike Firebug'a). Therefore, before inspecting the item, you need to select the page from the list that we want to view.

    Unfortunately, here, as in Internet Explorer DAV Toolbar, dynamically created elements are not displayed. And in general, when we inspect the page, no JavaScript starts: the links and buttons are not pressed. Let's hope when Dragonfly is suitable for release, we will see all these opportunities.

    Debug Web Inspector in Safari

    I'll tell you that about the browser Safari. Information whistled, so for the adequacy of the material, as they say, I do not answer.

    In order to enable in the Safari menu, the "Development" item is necessary in the settings (Advanced tab) in the appropriate item:

    In the "Development" menu, the following functions are available:

    Let's consider in the details of the Web inspector:

    By default, the inspector opens in HTML viewing mode. But it can be switched to the DOM view mode. To do this, there is a switch on the top of the rash. When you hover over an element in the inspector, it will be highlighted on the page itself. To see indents, change markup or CSS on the fly or see the dynamic change in DOME on the fly, as in Firebug it is impossible. But you will agree, it looks very cute.

    If there is a desire to work with an inspector in the browser window, you can click on the button in the lower left corner.

    Even in the safari, such a function as "network time scale" is available, (Network button in the inspector):

    You can clearly see when and how long the files are loaded. You can also view request headers, but the content itself to view, unfortunately, cannot be viewed.

    Debug for developers in Google Chrome

    Chrome appeared on the light in advanced form, and he immediately has, let it be curves, but still funds for developers.

    • Dom Inspector;
    • Javascript debugger;
    • JavaScript console.

    In order to inspect any element, you need to right-click on it and select "View the Item Code" in the context menu:

    The functionality is the same as in Safari: the elements are typked by hovering, but editing CSS and HTML are not available, changes in the DOM are not tracked. That's just, the button in the lower left corner, which should attach the inspector to the browser window does not work.

    In the "Resources" tab, we can see the following:

    Moto differs from the scale in safaris. Translucent on this scheme is a relative file size, and full color - download time. One way or another, it is obvious that this part of chromium is still not completed.

    In this article, I reviewed the most well-known extensions and built-in tools for browsers.

    There are others, for example:

    • Internet Explorer Web Development Helper - a good assistant for ASP.NET developers (Internet Explorer);
    • Web Developer Toolbar - Tulbar for Internet Explorer and Firefox. There are several useful features;
    • Web Accessibility Toolbar - Tulbar for Internet Explorer. Nothing interesting.

    If there are additions that I did not mention, but it would be worth it, or there are functions from the extensions mentioned, which I missed, write.

    Use on health!

    Write HTML - great, but how to understand where the error when something does not work? This article describes several tools that help to search and correct errors in HTML.

    Debugging is not scary

    While writing some code, usually everything goes well until the moment appears when you make a mistake. So your code does not work, or does not work as you thought. If you try to compile the non-working program in the RUST language, the compiler will indicate an error:

    In this case, the error message is to understand relatively simple - "Unterminated Double Quote String". If you carefully look at PrintLN! (Hello, World! ");, Then notice that there is no double quotion here. Of course, error messages can become much more complex for understanding as your code grows, and even the most simple cases may seem frightening for those who know nothing about Rust.

    But do not be afraid debugging! To write comfortably and debug any code, you need to understand the language and its tools.

    HTML and debugging

    HTML is not as folded to understand how to rust. HTML is not compiled in any other form before the browser analyzes this and show the result (it is interpreted, and not compiled). The HTML elements syntax is much clearer than that of real programming languages, such as Rust, JavaScript, or Python. The method to which browsers read HTML more tolerangethan in programming languages \u200b\u200binterpreting their code is stricter. It is at the same time bad, and good.

    Tolerant code

    So what does the tolerant mean? In general terms, when you were injected in the code, there are two types of errors with which you will encounter:

    • Syntax Errors (Syntax Errors): These are mistakes in the correctness of writing, as it was higher, in the example with Rust. Such is usually easy to correct, to the extent you know how familiar with the syntax of the language and know what error messages mean.
    • Logic errors (Logic Errors): These are errors that appear if the syntax is correct, but the code does not fulfill its purpose, that is, the program is incorrect. Such correction is more complicated than syntactic, since the messages indicate the place where you are mistaken.

    HTML does not suffer from syntax errors, because the browser reads the code tolerantly, in the sense that pages may be displayed even if the syntax errors are present. Browsers have built-in rules for interpretation of incorrectly written marking, and you can run something, even if you meant another. This can be a real problem!

    On a note: HTML reads tolerantly, because when the web appeared only, it was decided to allow people to publish content even if it is incorrect in the code, as it is much more important than confidence in absolutely correct syntax. Web would not be so popular now, if it were treated to beginners strictly.

    Active learning: familiarity with the tolerant code

    Time to study the nature of the tolerant code in HTML.


    HTML Validation

    From the example above it is clear that it is worth checking the HTML validity. In a simple example from above, you can simply view all the code and find errors, but what about huge, complex pages?

    It is best to check the page in the Validation Service Markup. It was created and supported by W3C - an organization that is engaged in HTML, CSS specifications and other web technologies. The service will check your HTML and make a report on errors in it.

    HTML can be checked at the address by downloading the file or simply scraping the page.

    Active learning: Validating HTML document

    1. Open the markup validation service in the browser.
    2. Go to Validate by Direct Input mode.
    3. Copy the entire document code (not just Body) and insert into place to enter.
    4. Press Check (check).

    You will see a list of errors and other information.

    Working with error messages

    It is usually clearly clear what messages mean, but sometimes you have to try to understand what's the matter. Now we will go through all the mistakes and wonder what they mean. Please note that the messages indicate the line and the code column so that the errors it is easier to search.

    • "END TAG LI IMPLIED, BUT THERE WERE OPEN ELEMENTS" (2 instances): There is no clear closing tag, although the browser is guessing where it should be. The message indicates a string after the one on which the closing tag was expected, but you will find the right place.
    • "Unclosed Element Strong": This is a very simple error - the element) indicates that its content is of great importance, seriousness or urgency. Browsers typically display the contents of bold. "\u003e Not closed, and the message indicates directly to the opening tag.
    • "END TAG STRONG VIOLATES NESTING RULES": the item is incorrectly invested - at this level there is no pair of opening tag.
    • "END OF FILE REACHED WHEN INSIDE AN ATTRIBUTE VALUE. IGNORING TAG": Mysterious message. The fact is that somewhere (most likely, at the end of the document) incorrectly spelled out the property of the element, and the end of the file was inside this property. The browser does not see the links - most likely the problem next to it.
    • "END OF FILE SEEN AND THERE WERE OPEN ELEMENTS": The file is over, but some elements are not closed. The message indicates the end of the file, in this case the EXAMPLE element is not closed: Link to Mozilla Homepage ↩
    ↩ ↩

    Quite often, users can observe the situation when the script error appears in the browser (IE). If the situation is part of a single character, then it is not worried, but when such mistakes become regular, then it is worth thinking about the nature of this problem.

    The Error script in Internet Explorer is usually called incorrectly processing the HTML-page code browser, the presence of temporary Internet files, account parameters, as well as many other reasons about which will be discussed in this material. Methods for solving this problem will also be considered.

    Before proceeding with generally accepted methods for diagnosing problems with Internet Explorer, which cause scenario errors, you need to make sure that the error occurs not only on one particular site, and immediately on multiple web pages. You also need to check the web page on which this problem has occurred under another account, on another browser and on another computer. This will cause the range of searching for the causes of the error and eliminate or confirm the hypothesis that messages appear as a consequence of the presence of some files or settings on the PC

    Blocking Internet Explorer active scripts, ActiveX and Java

    Active scenarios, ActiveX and Java elements affect the method of forming and displaying information on the site and can be a real reason for the previously described problem if they are blocked on the user's PC. In order to ensure that the script errors arise for this reason, it is necessary to simply reset the browser security settings. To implement this follow the recommendations.

    • Open Internet Explorer 11
    • Service

    • In the window, go to the tab Safety
    • Next Press the button Defaultand then button OK

    Internet Explorer temporary files

    Each time you open a web page, Internet Explorer keeps a local copy of this online page to the PC in the so-called temporary files. When such files become too much and the size of the folder containing them reaches several gigabytes, there may be problems with displaying a web page, namely, a message about the script error appears. Regular cleaning folder with temporary files can help eliminate this problem.
    To delete temporary Internet files, follow the following sequence of actions.

    • Open Internet Explorer 11
    • Service
    • In the window, go to the tab General
    • In chapter Browser magazine Press the button Remove ...

    • In the window Removing the history of the review Check flags near paragraphs Temporary Internet and Web Site, Cookies and Website Data, Magazine
    • Press the button Delete

    Anti-virus software work

    Script errors are possible through the operation of the antivirus program when it blocks active scenarios, ActiveX and Java elements on a page or folder to save browser temporary files. In this case, you need to turn to the documentation for the installed antivirus product and disable folder scan to save time Internet files, as well as blocking interactive objects.

    Incorrect HTML Page Code Processing

    Manifests us, as a rule, on one of the particular site and indicates that the page code is not fully adapted to work with Internet Explorer. In this case, it is best to turn off the debugging of scripts in the browser. To do this, follow these steps.

    • Open Internet Explorer 11
    • In the upper corner of the browser (right), click the icon Service In the form of a gear (or a combination of the ALT + X keys). Then in the opened menu, select item.
    • In the window, go to the tab Additionally
    • Next, uncheck the checkbox from the point Show notification about each script error and click OK.

    This list of the most frequent reasons that cause script errors in Internet Explorer, so if you are tired of such messages, pay slightly attention and solve the problem once and for all.

    At the moment there are a large number of different browsers, to one degree or another supporting existing HTML standards. Personally, I prefer the browser from the Mozilla corporation. This browser has a long history (it is written on the basis of the famous Netscape Navigator browser). Also, I also like this browser by the fact that it supports the system of plug-ins - separately spreadable additions, when connecting which you can change the functionality and configure your needs. And finally, this browser is freely distributed with open source codes, which is also important. Therefore, I decided to describe the opportunities that this browser provides not only to the user, but also the developer of Web pages, how easy and convenient to be the process of debugging written products.

    Mozilla Firefox is one of the most popular developers and Web Developers browsers. It attracts their attention due to the capabilities that this browser provides for debugging created projects, correcting errors, improvements. The standard browser delivery includes Java Console (or "Error Console"). This utility allows you to fix the built-in Java-Script scripts. But, a much greater functionality of the browser gives third-party plugins that can be downloaded and installed from the Mozilla Foundation official website. Now I want to consider two of these plugins - this is Web Developer and Firebug. Both of these additions can be downloaded according to the above links from the official add-on site. After their installation and restart browser, the developer offers ample opportunities that I will describe below, in turn for each of the plugins.

    Firebug Plugin.

    As stated on the official page: "Firebug integrates with Firefox browser to greatly enrich the developer's toolkit. You can edit, debug and explore CSS, HTML and JavaScript "live", on any web page. " And indeed it is. Consider some of the functions of this plugin, namely:

    • View and edit HTML.
    • Build CSS.
    • Network query monitoring
    • Debugging JavaScript.
    • JavaScript study
    • Logging for JavaScript.

    This is not a complete list of all its capabilities. So the project is open (OpenSource), then anyone can change and supplement functionality.

    To work with the plugin, you must press the F12 key (Ctrl-F12 to work with it in a separate window). After successful launch, we obtain the following - Figure 1A, 1B.

    Figure 1A. The initial window of the Firebug plugin.


    Figure 1B. The initial window of the Firebug plugin.

    Next, the actual work with the plugin begins. For example, we need to find a particular object in HTML code, or determine exactly the current fragment is implemented using CSS. To do this, you just need to select the necessary options in the plugin window menu. The example below is HTML in INSPECT mode. Now, by going to the document page, under the mouse cursor, we will notice the rectangular area illustrating the plot here with which work is underway. In the plug-in window, we will see those parameters HTML and CSS that are used. Also, by clicking on each of them, you can make changes and track them in the dynamics. The described actions are illustrated in Figures 2,3,4.



    The development of this project described above the plugin was used for these purposes. However, although java-script was not used here, the Firebug plugin can also be used to debug it. An example of debugging is shown in Figure 5.


    On this, as described above, the functionality of this expansion is not limited. You can study it completely and use in your needs by downloading the following links by installing Mozilla Firefox.

    Web Developer Plugin.

    Web Developer is the second expansion for the Mozilla Firefox browser, very powerful and functional, which allows you to produce fast and efficient debugging. After installing it, an additional panel with tools appears in the browser window, shown in Figure 6.

    Further work with the plugin intuitively understandable. For example, if we need to perform work with CSS (although not as fully functionally, as with a FireBug plugin), you can click the CSS menu and block, turn on or off.

    Very convenient for the developer is the Ironness to view how his project will look like on monitors, with different resolution. To do this, use the Resize tab. Here you can manually set the necessary screen resolutions (800x600, 1024x768, etc.), and then freely switch between them, contact or delete content. This functionality is depicted in Figure 7.

    This extension also has rich functionality, which are all described and available on official sites.

    List of used sources

    • 1. www.getfirebug.com
      Official add-on site.
    • 2. http://addons.mozilla.org.
      The official website of Mozilla, which places the plugins for the Firefox browser, information for developers, information on the use of plugins.
    • 3. http://chrispederick.com/Work/Web-Developer/
      Official website developer WebDeveloper plugin.

    Write HTML - great, but how to understand where the error when something does not work? This article describes several tools that help to search and correct errors in HTML.

    Debugging is not scary

    While writing some code, usually everything goes well until the moment appears when you make a mistake. So your code does not work, or does not work as you thought. If you try to compile the non-working program in the RUST language, the compiler will indicate an error:

    In this case, the error message is to understand relatively simple - "Unterminated Double Quote String". If you carefully look at PrintLN! (Hello, World! ");, Then notice that there is no double quotion here. Of course, error messages can become much more complex for understanding as your code grows, and even the most simple cases may seem frightening for those who know nothing about Rust.

    But do not be afraid debugging! To write comfortably and debug any code, you need to understand the language and its tools.

    HTML and debugging

    HTML is not as folded to understand how to rust. HTML is not compiled in any other form before the browser will analyze it and show the result (it is interpreted, but not compiled). The HTML elements syntax is much clearer than that of real programming languages, such as Rust, JavaScript, or Python. The method to which browsers read HTML more tolerangethan in programming languages \u200b\u200binterpreting their code is stricter. It is at the same time bad, and good.

    Tolerant code

    So what does the tolerant mean? In general terms, when you were injected in the code, there are two types of errors with which you will encounter:

    • Syntax Errors (Syntax Errors): These are mistakes in the correctness of writing, as it was higher, in the example with Rust. Such is usually easy to correct, to the extent you know how familiar with the syntax of the language and know what error messages mean.
    • Logic errors (Logic Errors): These are errors that appear if the syntax is correct, but the code does not fulfill its purpose, that is, the program is incorrect. Such correction is more complicated than syntactic, since the messages indicate the place where you are mistaken.

    HTML does not suffer from syntax errors, because the browser reads the code tolerantly, in the sense that pages may be displayed even if the syntax errors are present. Browsers have built-in rules for interpretation of incorrectly written marking, and you can run something, even if you meant another. This can be a real problem!

    On a note: HTML reads tolerantly, because when the web appeared only, it was decided to allow people to publish content even if it is incorrect in the code, as it is much more important than confidence in absolutely correct syntax. Web would not be so popular now, if it were treated to beginners strictly.

    Active learning: familiarity with the tolerant code

    Time to study the nature of the tolerant code in HTML.

    1. To start, download our example debugging and save locally. This demonstration is intentionally written with the errors that we have to detect.
    2. Next, open it in the browser. You will see something like this:
    3. Now the document looks not particularly good; Let's look into the code and find out why (only the document body is shown):

      HTML DEBUGGING EXAMPLES.

      What Causes Errors in HTML?

      • Unclosed Elements: IF An Element Is not Closed Properly, Then Its Effect Can Spread to Areas You Didn "T Intend
      • Badly Nested Elements: Nesting Elements Properly Is Also Very Important for Code Behaving Correctly. strong. strong Emphasised? What is this?
      • Unclosed Attributes: Another Common Source of Html Problems. Let "S Look At An Example: Link to Mozilla Homepage
    4. Consider problems:
      • W. параграфа!} And it is used to create a list item. "\u003e The list item is not closed tags. In the image, it is clear that the markup is not affected, since the browser is easy to conclude about where one element ends and the other starts.
      • The first) indicates that its content is of great importance, seriousness or urgency. Browsers typically display the contents of bold. "\u003e The element also does not have a closing tag. It is already more problematic, as it is difficult to say where the element must end. In fact, all the remaining text was allocated fat.
      • The next part violates the nesting fault: strong. strong Emphasised? What is this? . In this case, the code is also difficult to interpret due to the above described above.
      • The HREF attribute lacks a closing double quotation. This was the cause of a major problem - the link was not reproduced at all.
    5. Now let's see how the browser generated its own markup, as opposed to the initial markup of the document. To do this, use the developer tools. If you are not familiar with the developer tools, take a few minutes to overview the development tools in browsers.
    6. In the DOM inspector you can see how new marking was generated:
    7. Using the DOM inspector, let's look at the details of our code to see how the browser is trying to correct our errors in HTML (we review in Firefox; another modern browser must issue the same results):
      • Paragraphs and list items are obtained with closing tags.
      • It was not obvious where the element It should have closed, so the browser wrapped every single block of text with its own Strong tags, and until the bottom of the document!
      • Incorrect nesting was fixed by the browser as follows: strong. strong Emphasised? What is this?
      • Link with missing double quotes was removed by the commemoration. The last element of the list will look like this:
      • Unclosed Attributes: Another Common Source of Html Problems. Let "S Look AT An Example:

    HTML Validation

    From the example above it is clear that it is worth checking the HTML validity. In a simple example from above, you can simply view all the code and find errors, but what about huge, complex pages?

    It is best to check the page in the Validation Service Markup. It was created and supported by W3C - an organization that is engaged in HTML, CSS specifications and other web technologies. The service will check your HTML and make a report on errors in it.

    HTML can be checked at the address by downloading the file or simply scraping the page.

    Active learning: Validating HTML document

    1. Open the markup validation service in the browser.
    2. Go to Validate by Direct Input mode.
    3. Copy the entire document code (not just Body) and insert into place to enter.
    4. Press Check (check).

    You will see a list of errors and other information.

    Working with error messages

    It is usually clearly clear what messages mean, but sometimes you have to try to understand what's the matter. Now we will go through all the mistakes and wonder what they mean. Please note that the messages indicate the line and the code column so that the errors it is easier to search.

    • "END TAG LI IMPLIED, BUT THERE WERE OPEN ELEMENTS" (2 instances): There is no clear closing tag, although the browser is guessing where it should be. The message indicates a string after the one on which the closing tag was expected, but you will find the right place.
    • "Unclosed Element Strong": This is a very simple error - the element) indicates that its content is of great importance, seriousness or urgency. Browsers typically display the contents of bold. "\u003e Not closed, and the message indicates directly to the opening tag.
    • "END TAG STRONG VIOLATES NESTING RULES": the item is incorrectly invested - at this level there is no pair of opening tag.
    • "END OF FILE REACHED WHEN INSIDE AN ATTRIBUTE VALUE. IGNORING TAG": Mysterious message. The fact is that somewhere (most likely, at the end of the document) incorrectly spelled out the property of the element, and the end of the file was inside this property. The browser does not see the links - most likely the problem next to it.
    • "END OF FILE SEEN AND THERE WERE OPEN ELEMENTS": The file is over, but some elements are not closed. The message indicates the end of the file, in this case the EXAMPLE element is not closed: Link to Mozilla Homepage ↩


    Updated: November 2007

    The ASP.NET platform provides advanced web application debug support. However, due to the distributed nature of web applications, their debugging is characterized by some features.

    In general, web applications are debugged as well as other Visual Studio applications. You can set the stoppoints, run the debugger, pause the execution of the code, check the values \u200b\u200bof the variables and perform all the functions associated with the Visual Studio debugger. For more information, see section. In addition to this, the ASP.NET platform supports the trace mode that allows you to insert tool in the form. For details, see sections and.

    For more information about remote debugging, see section.

    Regardless of where debugging will be made - on the local computer or on the remote, it is necessary to make sure that debugging is allowed for this web application. To enable debugging the web.config file, which is part of the web application project. This parameter prescribes the compiler to insert debugging characters into the compiled application code so that the debugger can be used for it. You can enable debugging using the Web site administration tool. For more information, see section.

    At the moment there are a large number of different browsers, to one degree or another supporting existing HTML standards. Personally, I prefer the browser from the Mozilla corporation. This browser has a long history (it is written on the basis of the famous Netscape Navigator browser). Also, I also like this browser by the fact that it supports the system of plug-ins - separately spreadable additions, when connecting which you can change the functionality and configure your needs. And finally, this browser is freely distributed with open source codes, which is also important. Therefore, I decided to describe the opportunities that this browser provides not only to the user, but also the developer of Web pages, how easy and convenient to be the process of debugging written products.

    Mozilla Firefox is one of the most popular developers and Web Developers browsers. It attracts their attention due to the capabilities that this browser provides for debugging created projects, correcting errors, improvements. The standard browser delivery includes Java Console (or "Error Console"). This utility allows you to fix the built-in Java-Script scripts. But, a much greater functionality of the browser gives third-party plugins that can be downloaded and installed from the Mozilla Foundation official website. Now I want to consider two of these plugins - this is Web Developer and Firebug. Both of these additions can be downloaded according to the above links from the official add-on site. After their installation and restart browser, the developer offers ample opportunities that I will describe below, in turn for each of the plugins.

    Firebug Plugin.

    As stated on the official page: "Firebug integrates with Firefox browser to greatly enrich the developer's toolkit. You can edit, debug and explore CSS, HTML and JavaScript "live", on any web page. " And indeed it is. Consider some of the functions of this plugin, namely:

    • View and edit HTML.
    • Build CSS.
    • Network query monitoring
    • Debugging JavaScript.
    • JavaScript study
    • Logging for JavaScript.

    This is not a complete list of all its capabilities. So the project is open (OpenSource), then anyone can change and supplement functionality.

    To work with the plugin, you must press the F12 key (Ctrl-F12 to work with it in a separate window). After successful launch, we obtain the following - Figure 1A, 1B.

    Figure 1A. The initial window of the Firebug plugin.


    Figure 1B. The initial window of the Firebug plugin.

    Next, the actual work with the plugin begins. For example, we need to find a particular object in HTML code, or determine exactly the current fragment is implemented using CSS. To do this, you just need to select the necessary options in the plugin window menu. The example below is HTML in INSPECT mode. Now, by going to the document page, under the mouse cursor, we will notice the rectangular area illustrating the plot here with which work is underway. In the plug-in window, we will see those parameters HTML and CSS that are used. Also, by clicking on each of them, you can make changes and track them in the dynamics. The described actions are illustrated in Figures 2,3,4.



    The development of this project described above the plugin was used for these purposes. However, although java-script was not used here, the Firebug plugin can also be used to debug it. An example of debugging is shown in Figure 5.


    On this, as described above, the functionality of this expansion is not limited. You can study it completely and use in your needs by downloading the following links by installing Mozilla Firefox.

    Web Developer Plugin.

    Web Developer is the second expansion for the Mozilla Firefox browser, very powerful and functional, which allows you to produce fast and efficient debugging. After installing it, an additional panel with tools appears in the browser window, shown in Figure 6.

    Further work with the plugin intuitively understandable. For example, if we need to perform work with CSS (although not as fully functionally, as with a FireBug plugin), you can click the CSS menu and block, turn on or off.

    Very convenient for the developer is the Ironness to view how his project will look like on monitors, with different resolution. To do this, use the Resize tab. Here you can manually set the necessary screen resolutions (800x600, 1024x768, etc.), and then freely switch between them, contact or delete content. This functionality is depicted in Figure 7.

    This extension also has rich functionality, which are all described and available on official sites.

    List of used sources

    • 1. www.getfirebug.com
      Official add-on site.
    • 2. http://addons.mozilla.org.
      The official website of Mozilla, which places the plugins for the Firefox browser, information for developers, information on the use of plugins.
    • 3. http://chrispederick.com/Work/Web-Developer/
      Official website developer WebDeveloper plugin.