Web Front-end skills

1Focus, and blur events do not support bubbling, But they support capturing. Therefore, we can use capture in event proxy, but IE does not support capturing, ie can be replaced by focusin and focusout, which support bubble

2,Location is recommended for page refresh. replace and location. the href method does not recommend location. reload and history. go (0), because the two refreshes are equivalent to pressing F5 to refresh, it is easy to prompt whether to submit the form repeatedly on the page with form submission.

3,Using array. Join to connect strings in Internet Explorer is the fastest, while ++ = or string. Prototype. Concat. Apply (object, arguments) performs better in other browsers.

4Determine the length of Chinese and English charactersIf (string. Match (/[^ \ x00-\ xFF]/ig )! = NULL) // fullwidth 

5Calculate the total number of days in a month in a year:

Function days_in_month (Y, m ){

Return 32-new date (Y, m-1, 32). getdate ();

}

6Jquery: $. ajaxsetup ({cache: false });

7The maximum and minimum values of the array.

Math. Max. Apply (Math, [1, 2, 3]) // 3

Math. Min. Apply (Math, [1, 2, 3]) // 1

8Set padding for the row element. Only padding-left and padding-right take effect, and padding-top and padding-bottom are invalid.

For example, if the Row Element <A> applies the padding: 50px, it only affects the left and right, but does not affect the upper and lower.

9And js iframe operations

Obtain the window object of IFRAME:

Chrome: iframeelement. contentWindow Firefox: iframeelement. contentWindow

IE6: iframeelement. contentWindow

Get the Document Object of IFRAME:

Chrome: iframeelement. contentdocumentfirefox: iframeelement. contentdocument

IE: element.content+doc ument

10IE6 horizontal scroll bar Solution
HTML {_ overflow-X: hidden ;}

11, Positioning left and right do not move the scroll bar
<Style type = "text/CSS">
# Bannerleft {width: 100px; Height: 600px; float: Left; position: relative; left:-100px; Background: # CCC ;}
# Bannerright {width: 100px; Height: 600px; float: Right; position: relative; Right:-100px; Background: # CCC ;}
</Style>
<Div class = "Wrap" style = "position: fixed; _ Position: absolute; top: 0; left: 50%; margin-left:-495px;">
<Div id = "bannerleft"> banner left </div>
<Div id = "bannerright"> banner right </div>
</Div>

12The Mouseover and mouseout events are used as conditions for event triggering, however, if we use other elements inside the trigger element, when the mouse moves up, the Mouseover and mouseout events will be repeatedly triggered. Because the internal element will dispatch an event to its parent object when moving the mouse, the external element also triggers the Mouseover event. 

To prevent repeated triggering of Mouseover and mouseout, A relatedtarget attribute of the event object is used to determine the attributes of relevant nodes of the target node of the Mouseover and mouseout events. Simply put, when the Mouseover event is triggered, the relatedtarget attribute represents the node that the mouse has just left on behalf of the table. When the mouseout event is triggered, it represents the object where the mouse moves. MSIE does not support this attribute, but it has a substitute attribute, namely fromelement and toelement.
Return e. relatedtarget | (E. fromelement & E. fromelement === E. srcelement? E. toelement: E. fromelement );

13,Javascript Audio/Video Player
Html5media (Official Website: http://html5media.info/) is a javascript audio/video player that enables everyBrowserYou can play all the multimedia files defined in the HTML5 multimedia tag. For incompatible browsers, the playback will adopt flash-EnabledFlowplayerPlayer instead.

14 : solves the problem of translucent images in IFRAME, and does not display translucent images in IE.
in IE, IFRAME contains a translucent image, but it cannot display a translucent image.
you can add an attribute allowtransparency = "true" to IFRAME in HTML ".
For example: allowtransparency =" true "&lt;/span&gt; src =" test.htm "&gt;