Summary of web front-end compatibility interview questions
One, html part
1. H5 new tag is recognized by browsers below IE9
html5shiv.js download address
2. The problem of the inner and outer margins of the ul label. The ul label has a default outer margin in IE6\IE7, but there is a default inner margin in IE8 and above and other browsers.
Solution: uniformly set the inner and outer margins of ul to 0
Second, the compatibility of CSS styles
1. The css hack problem: mainly for different versions of IE, and different browsers have different writing methods
IE's conditional comment hack:
The content here is only visible in IE7.0
2. IE6 double-side distance problem: IE6 has a horizontal margin after floating. At this time, the outer margin of the element is twice its value
Solution: display:block;
3. There is a gap under the picture under IE6
Solution: set display:block; for img
4. There will be a 3px bug between the two floats in IE6
Solution: also set float: left; for the element on the right;
5. There is no concept of min-width under IE6, its default width is min-width
6. Margin:0 auto is used under IE6; it cannot be centered
Solution: set text-align:center; for its parent container
7. The hyperlink after being clicked no longer has hover and active attributes
Solution: Write the css style in the order of lvha,
":link": a state where the tag has not been accessed;
":visited": the state that a tag has been visited;
":hover": the state of the mouse hovering over the a tag;
":active": the state of a label when it is pressed by the mouse;
8. After using absolute positioning or relative positioning, the z-index setting in IE fails because its elements depend on the z-index of the parent element, but the parent element is 0 by default, and the child is high and the parent is low, so the display will not be changed Order.
9. The line height of 1px cannot be set under IE6, the reason is caused by its default line height
Solution: set overflow: hidden; or line-height:1px;
Three, JavaScript compatibility
1. The standard event binding method function is addEventListener, but it is attachEvent under IE;
2. The event capture method is inconsistent. The standard browser is from the outside to the inside, while IE is from the inside to the outside, but the final result is to set the IE standard as the standard
3. Obtained by window.event. And the method to get the target element is also different, the standard browser is event.target, and the IE is event.srcElement
4. The value of the date processing function obtained in the lower version of IE is not the difference from 1900, but in the higher version of IE, it is consistent with the standard browser, and the obtained value is also the difference from 1900.
For example: var year = new Date().getYear();
5. Ajax is implemented in different ways. What I understand is the difference in obtaining XMLHttpRequest, which is activeXObject under IE
6. The innerHtml of tr cannot be operated in IE 7. The way to get the parent node and child node of the DOM node is different
Other browsers: parentNode parentNode.childNodes
IE：parentElement parentElement.childre
If you want to know about web front-end compatibility interview questions and web front-end related technical issues, you can follow Xiaoqian and share more technical knowledge and industry information later. Waiting for you~~~~