Thursday, March 20, 2014

javascript interview questions

what is literal notation in javascript
An object literal is a comma separated list of name value pairs wrapped in curly braces. In JavaScript an object literal is defined as follows:
var myObject = {
sProp: 'some string value',
numProp: 2,
bProp: false
};
Object literals are used as a means of encapsulating data, enclosing it in a tidy package to minimize the use of global variables which can cause problems when combining code.
Applying style to form elements?
input[type=text]
{
background-color: #BFBDBD;
border:solid 1px #BFBDBD;
color: #979797;
height: 28px;
padding-left:10px;
width: 191px;
box-shadow: 2px 2px 0 #828181 inset;
}
input[type=button]
{
background-color: #1E1E1E;
color: #979797;
height: 24px;
width: 103px;
color: #bbbbbb;
text-transform:uppercase;
box-shadow:-1px 2px #6E6B6A inset;
}


input[type=button], input[type=text]
{
border: 0;
border-radius:5px;
font-family: Sansation,Arial;
}
CSS Apply border to all input elements except checkbox
input:not([type=checkbox])
{
border: 1px solid #039;
}
Whar are css3 selectors?
Overview of CSS 3 selector syntax Selector type Pattern Description
Substring matching attribute selector
E[att^=”val”] Matches any E element whose att attribute value begins with “val”.
Substring matching attribute selector
E[att$=”val”] Matches any E element whose att attribute value ends with “val”.
Substring matching attribute selector
E[att*=”val”] Matches any E element whose att attribute value contains the substring “val”.
Structural pseudo-class
E:root Matches the document’s root element. In HTML, the root element is always the HTML element.
Structural pseudo-class
E:nth-child(n) Matches any E element that is the n-th child of its parent.
Structural pseudo-class
E:nth-last-child(n) Matches any E element that is the n-th child of its parent, counting from the last child.
Structural pseudo-class
E:nth-of-type(n) Matches any E element that is the n-th sibling of its type.
Structural pseudo-class
E:nth-last-of-type(n)
Matches any E element that is the n-th sibling of its type, counting from the last sibling.
Structural pseudo-class
E:last-child Matches any E element that is the last child of its parent.
Structural pseudo-class
E:first-of-type Matches any E element that is the first sibling of its type.
Structural pseudo-class
E:last-of-type Matches any E element that is the last sibling of its type.
Structural pseudo-class
E:only-child Matches any E element that is the only child of its parent.
Structural pseudo-class
E:only-of-type Matches any E element that is the only sibling of its type.
Structural pseudo-class
E:empty Matches any E element that has no children (including text nodes).
Target pseudo-class
E:target Matches an E element that is the target of the referring URL.
UI element states pseudo-class
E:enabled Matches any user interface element (form control) E that is enabled.
UI element states pseudo-class
E:disabled Matches any user interface element (form control) E that is disabled.
UI element states pseudo-class
E:checked Matches any user interface element (form control) E that is checked.
UI element fragments pseudo-element
E::selection Matches the portion of an element E that is currently selected or highlighted by the user.
Negation pseudo-class
E:not(s) Matches any E element that does not match the simple selector s.
General sibling combinator
E ~ F Matches any F element that is preceded by an E element.


<div id="nav-primary"></div>
<div id="content-primary"></div>
<div id="content-secondary"></div>
<div id="tertiary-content"></div>
<div id="nav-secondary"></div>
By using the substring matching attribute selectors you can target combinations of these structural parts of the document.
The following rule will set the background colour of all div elements whose id begins with “nav”:
div[id^="nav"] { background:#ff0; }
In this case the selector will match div#nav-primary and div#nav-secondary.
To target the div elements whose id ends with “primary”, you could use the following rule:
div[id$="primary"] { background:#ff0; }
This time the selector will match div#nav-primary
How to add css to buttons?
input[type="button"], input[type="submit"] {
color:#050;
font: bold 84% 'trebuchet ms',helvetica,sans-serif;
background-color:#fed;
border:1px solid;
border-color: #696 #363 #363 #696;
}
button {
color:#050;
font: old 84% 'trebuchet ms',helvetica,sans-serif;
background-color:#fed;
border:1px solid;
border-color: #696 #363 #363 #696;
}
To grab all three kinds of buttons:
button, input[type="button"], input[type="submit"] {
color:#050;
font: bold 84% 'trebuchet ms',helvetica,sans-serif;
background-color:#fed;
border:1px solid; ha
border-color: #696 #363 #363 #696;
}
What is siblings means ?
siblings means simply brothers and sisters realation ship, for example we are having following div's
<div id="main">
<img src=""/>
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
<a href=""></a>
</div>
so in the above what are the siblings of div id="two " is?
the above and below all elements id="one", id="three" img and anchor tag all are siblings of that div id="two".



No comments:

Post a Comment