--------- JQ ---------

1.jq common selector?

No. selector, the selector group. Space, grandfather selector. > Greater than the number, the selector Sons. + Number selector immediately next sibling selector. ~ No, all siblings after the element element.

：first，：last，：not，：first-child，:last-child,:animated.：checked

2.jQuery plug-in implementation, were introduced?

$ jQuery.fn.extend encapsulated directly following methods, that is below the root,

Extended jQuery element set to provide a new method (generally used to make plug-in).

$ .Extend used to add a new function on the jQuery namespace. With one or more other objects to extend an object, returns object is extended

Batch method with fn, static with $ .extend (), is not recommended to extend below the root.

3.bind difference and live in?

In fact, live method is a variant of the bind method, its basic function to bind the same function method is the same, both as an element binding an event, but the method can only bind to the binding elements of the current existence of events afterwards for adoption the new generation of JS invalid elements, etc., and live method is just to make up for this deficiency bind method, which can generate the elements can also bind the corresponding event.

How 4.js and jq conversion?

jQuery object is an object generated DOM objects packaged by jQuery. jQuery jQuery object is unique

, Which may be used in the method of jQuery, but can not use the DOM method; for example:

$ ( "# Img") attr ( "src", "test.jpg");. Where $ ( "# img") is the jQuery object.

Javascript DOM object that is inherent in the operation of some objects. DOM objects can use Javascript inherent, but can not be used in jQuery methods. For example:. Document.getElementById ( "img") src = "test.jpg"; document.getElementById here ( "img") is the DOM object.

$ ( "# Img") attr ( "src", "test.jpg");. And document.getElementById ( "img") src = "test.jpg";. Are equivalent, is correct, but $ ( "#img") src = "test.jpg";. or document.getElementById ( "img") attr ( "src", "test.jpg");. wrong.

DOM object into a jQuery object

For already a DOM object, just use the $ () to wrap up the DOM object, you can get a jQuery object of, $ (DOM object)

Such as: var v = document.getElementById ( "v"); // DOM objects

var $ v = $ (v); // jQuery objects

After the conversion, it can be arbitrarily jQuery method.

jQuery object into a DOM object

Two conversion way of telling a jQuery object is converted into a DOM object: [index] and .get (index);

(1) jQuery object is a data object, by [index] method to give the corresponding DOM object.

Such as: var $ v = $ ( "# v"); // jQuery objects

var v = $ v [0]; // DOM objects

alert (v.checked); // detect whether the checkbox is checked

(2) jQuery itself provides, to give the corresponding DOM object by .get (index) Method

Such as: var $ v = $ ( "# v"); // jQuery objects

var v = $ v.get (0); // DOM objects ($ v.get () [0] may be)

alert (v.checked); // detect whether the checkbox is checked

By the above method, the conversion can be arbitrarily jQuery objects and DOM object, need to be emphasized are:

DOM objects can use the DOM, jQuery DOM object is a method not in use.

--------- JS ---------

1. BFC What is ?

BFC (context block level format), creating a new independent BFC box layout, the layout of the box element will not affect the outer box element. margin problem of overlapping in the same BFC two adjacent boxes in the vertical direction occurs

BFC means the browser to create a separate rendering area, the layout of all the elements in the region will not affect the layout area outside elements, rendering this area only block-level element to work.

2. Doctype role ? Strict mode and mixed mode - how to trigger these two models, which distinguish what is the significance ?

( 1), <! DOCTYPE> declaration document located in the front, in the <html> tag before. It tells the parser browser, what type of document to resolve this specification document.

( 2), and JS strict mode layout mode of operation is run to the highest standards of the browser supports.

( 3), in promiscuous mode, the loose pages display backwards-compatible way. Simulate the behavior of older browsers to prevent the site does not work.

( 4), there is no DOCTYPE or incorrectly formatted will result in the document presented in promiscuous mode

3. inline elements What? Block-level elements are there? Empty (void) elements are those?

( . 1) the CSS specification, each display element has attributes, determine the type of the element, each display element has a default value, such as the default display attribute value div "Block", a "block level" element; span The default display attribute value is "inline", is "inline" element.

( 2) the line element has: INPUT SELECT strong ab & span IMG (emphasis tone) block-level element has: div UL OL Li h1 of DL dt dd H2 H3 H4 ... P

( 3) leading empty elements: <hr> <img> <input> <link> <meta> Little is known: <Area> <Base> <COL> <the Command>

4. CSS selectors What? What attributes can be inherited? How priority algorithm? CSS3 new pseudo-classes are those?

* 1.id selector (# myid)

2. class selector (.myclassname)

3. tag selector (div, h1, p)

4. adjacent selector (h1 + p)

The child selector (ul> li)

6. descendant selectors (li a)

7. Wildcard selector (*)

8. attribute selector (a [rel = "external" ]) can be extended attribute values

9. The pseudo class selector (a: hover, li: nth - child) link vitetd hover active

* 可继承： font-size font-family color, UL LI DL DD DT;

* Do not inherit: border padding margin width height;

* Priority of the principle of proximity, whichever style definitions recently;

* Load Styles to last loaded positioning prevail;

Priority :

!important > id > class > tag

important priority than inline

Example CSS3 new pseudo-class:

p: first-of-type selecting each element belonging to the first parent element element.

p: last-of-type selecting each element belonging to the last parent element element.

p: only-of-type selecting each element belonging parent element only element.

p: only-child selects each element unique child elements belonging to the parent element.

p: nth-child (2) for each selected elements belonging to the parent element of the second subelement.

: Enabled,: disabled control disabled form controls.

: Checked, radio buttons or check box is selected.

Interview common technical problems