Web front-end development test questions Read notes

Citation

Http://www.w3cplus.com/css/front-end-web-development-quiz.html

Q7: What is the following code popup value?

x = 1;function Bar () {    this.x = 2;    return x;} var foo = new bar (); alert (foo.x);

Answer: 2

Here the main problem is the definition of the outermost x, try to change the x=1 to x={}, the results will be different. What is this for? When using a function as a constructor, if a value is returned manually, it depends on whether the value is a simple type, if it is, it is equivalent to not writing the return, and if it is not a simple type, the value is returned manually. If you do not write the return value manually, an object is created from the prototype to be returned by default.

Note: If you change to a X={},alert value of undefined.

Q11: What is the following code popup value?

function foo (a) {    arguments[0] = 2;    alert (a);} Foo (1);

Answer: 2

The arguments can be modified directly from the arguments array.

Note: Even if the argument is not a simple type, it will be modified.

Q14: What is the color of the "sausage" text?

#awesome. Favorite:not (#awesome). Highlight {    color:red;} #awesome. Favorite. Highlight:nth-of-type (1): Nth-last-of-type (1) {    color:blue;}

<ul class= "shopping-list" id= "awesome" >    <li><span>Milk</span></li>    <li class= "Favorite" id= "Must-buy" ><span class= "highlight" >Sausage</span></li></ul>

Answer: Red

For each ID attribute value given in the selector, add "0,1,0,0". For each class property value given in the selector, attribute selection or pseudo class, add "0,0,1,0". For each element given in the selector as a pseudo-element, add "0,0,0,1". The binding and wildcard characters "*" and ": Not ()" Do not have any added powers. For inline styles, the addition of "1,0,0,0" for "!important" is higher than everything above, and will become "1,0,0,0,0" CSS3, although: the Not () Negation pseudo class itself is not counted as the weight count (b), but: the selectors in not () still participate in the calculation of weights, That is to say. Demo:not (#foo) The actual weight of 1,1,0,.demo:not (. Foo) is 0,2,0.

The difference between pseudo-class and pseudo-element reference here

Q19: After the page is loaded, will the browser download the "mypic.jpg" image?

<div id= "Test1" >    <span id= "Test2" ></span></div>

#test1 {    display:none;} #test2 {    background-image:url (' mypic.jpg ');}

Answer: No

Note:

IMG tag src, regardless of img for Visibility:hidden; or the Display:none; , it will load

CSS, if the parent element #test1 as Display:none; , the background-image of the child element #test2 will not be loaded;

If the parent element #test1 displayed or Visibility:hidden; , the background-image of child element #test2 will be loaded;

No matter what style the parent element #test1, its own background-image will be loaded