Web front-end Course Detection 2

First, Brief Answer ( 6 points per topic , 90 points total )

1.What are the selectors for CSS?

(Score standard: 6 points, any choice of more than 6 to get full marks)

Property Selector p{}, class selector. cls{}, id selector #id {}, universal selector *{}

Pseudo-Class selector: hover{}, Pseudo-object selector: after{}, descendant selector a b{}

Descendant selector a>b{}, set selector a,b{}, intersection selector a#b{}

2, What is called CSS initialization? What is the common CSS initialization and what is the difference?

(Score standard: 6 points, according to the response to the appropriate points)

CSS initialization is to solve the default styles of different browsers, and choose to directly empty the default style of the Web page, to maintain the unity of the different browser display effect. (2 points)

the usual amount There are two ways to initialize CSS: Reset.css normalize.css (2 points)

Reset clears all browser default styles, while normalize retains some uniform and valid styles in the browser (2 points)

3.What are the data types of javascript? (Score standard: 1 points per article, out of 6 points, all written in Chinese or full English 3 points)

Undefined: Not defined.

Null: Represents an empty reference.

Boolean: Boolean type

Number: Numeric type

String: Character type

Object: Types of objects

4. Explain the this pointer, closure, scope in JavaScript?

(Score standard: 6 points, according to the response to the appropriate points)

This points to the this in the JS function, which always points to the object where the function call statement is located (who called the function, this is WHO). (2 points)

Closures : in the function, write a child function. The inner layer function can access variables in the outer function. (2 points)

Scope: the scope in which the variable takes effect is called the scope. There are only global scopes and function scopes in JS. (2 points)

5. What is the difference between the attribute attr () method and Val () using the jquery action element?

(Score standard: 6 points, 3 points per article)

Attr (): Used to read or set the attributes of an element;

Val (): Used to read or set the value of the form element;

6.How does JavaScript create nodes, delete nodes, replace nodes, and replicate nodes? (Score standard: 6 points, 1.5 points per article)

Create node : . createlement ();

Delete node : . removechild ();

Replace node : . replacechild ();

Replication nodes : . CloneNode (True/false);

7,the difference between Jquery.extend and jquery.fn.extend?

(Score standard: 6 points, 3 points per article)

Jquery.extend: Used to declare global plug-ins/methods. DECLARE plug-ins/methods using $.func (); Call directly

Query.fn.extend: Used to declare a local plug-in/method. Declares the plug-in/method using $ ("selector"). Func (); Called after the node is selected.

8. describe the event flow model in JS? And how do I prevent events from bubbling?

(Score standard: 6 points, the answer is reasonable to score)

The event flow model in JS is divided into event bubbling and event capture:

event bubbling: When a When a DOM element triggers an event, it starts at the current node and increments the same type of event that triggers its ancestor node until the DOM root node; (2 points)

Event Capture: when a When a DOM element triggers an event, it starts at the root of the document, triggering the same type of event of its ancestor node down to the node itself; (2 points)

Cancel Event Bubbling:

in the IE8 before the browser, use e.cancelbubble = true; (1 points )

in other browsers, use e.stoppropagation ();(1 points)

9. What are the elements in the line? What are block-level elements? What are the empty (void) elements?

(Score standard: 6 points, each 2 points, choose 3 more than a full mark)

Line-level elements :<span> <a> <input> <b> <strong> <em> etc

block-level elements: <div> <p>

Empty elements : <meta/> <input/> <link/>

10,JS in how to convert the array into a JSON string, and then converted back?

(Score standard: 6 points, 3 points per item)

The array is converted to JSON string: json.stringify (arr);

JSON string converted to JSON object: Json.parse (str);

11, Please say three ways to reduce the page load time?

(Score standard: 6 points, any choice of 3 get full marks, other reasonable answers can be)

① The JS file to the last load of the document;

② multiple JS files, CSS files combined compression;

③ use Sprite Chart to merge the small pictures in the page;

④ images using JS for lazy loading;

⑤ other reasonable answers are available

12, write the primary JS implementation of aJax key steps?

(Score standard: 6 points, as appropriate to the points)

var ajax = new XMLHttpRequest ();(1 min)

Ajax.onreadystatechange = function () {(1 points)

if (ajax.readystate==4 && ajax.status==200) {(1 points)

Console.log (Ajax.responsetext); (1 points)

}

}

Ajax.open ("GET", "H51701.json"); (1 points)

Ajax.send (NULL); (1 points)

13, What is called homologous strategy? Write a way to resolve Ajax cross-domain requests? (Score standard: 6 points, as appropriate to the points)

Homologous policy : When requesting another file data from a file,JS requires that two files must be under the same protocol name, the same hostname, and the same port number before the request succeeds. (3 points )

Cross-Domain Request Processing: (3 points, choose one to get full marks )

① in the background php

Settings: Header ("access-control-allow-origin:*");

② uses the SRC attribute +jsonp cross-domain.

<script type= "Text/javascript" src= "request Address" ></script>

Require the background to return the callback function name, and return the data passed through the parameters, and write the callback function in the foreground.

③jquery Implementation JSONP:

$.ajax ({

Type: "Post",

URL: "http://localhost/H5-1705PHP/json.php",

DataType: "Jsonp",

Success:function (data) {

Console.log (data);

}

});

14,. What is the difference between link and @import in CSS ? What kind of commonly used?

(Score standard: 6 points, choose 3 to get full marks)

①link belongs to the standard HTML tag, while @import is not a standard label;

②link can be compatible with all low-version browsers, while @import is only available after CSS2;

③link is a bridge that links two files, while @import is the equivalent of copying CSS files to an HTML file;

④link will be in the process of loading HTML files, side link CSS file;

@import will import the CSS file after all the HTML files have been loaded;

15.What are the different transparency effects of RGBA () and opacity?

(Score standard: 6 points, each 3 points, the answer is reasonable to score)

Opacity: You can make the color, background color, and all child elements of the current element transparent

RGBA (): Only the color or background colors of the current element can be made transparent and the child element has no effect.

Second, Programming Questions ( 10 points per topic , 10 points Total )

second, the programming problem (total 10 points)

There is such a Url:http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e, please write a JS program to extract the URL of the various get parameters ( Parameter names and number of arguments are indeterminate),

Return it in key-value form to a JSON structure, such as {a: ' 1′, B: ' 2′, C: ', D: ' xxx ', e:undefined}

var arr = [1,2,3,3,4,4,5,5,6,1,9,3,25,4];

var newArr = [];

for (var i=0; i<arr.length; i++) {

if (Newarr.indexof (Arr[i]) <0) {

Newarr.push (Arr[i]);

}

}

Web front-end Course Detection 2