jQuery Interview Questions and Answers (185) - Page 10

Briefly explain what is DOM selector in jquery (AKA JQuery Selector) ?

jQuery selector($),the vital part of JQuery, allow Html elements to be selected and manipulated.It finds the elements by Element Name,Element ID or class and returns a sequence of matched DOM elements upon a successful match. We can they apply methods or logics on those collection for further processing. It can be of the following types :

- Single Element Name Selectors
- Multiple Selectors
- Id Selectors
- CSS Selectors
- Attribute Selectors
- Element Visibility Selectors
- Form Field Selectors
- Parent-Child Selectors
Why do we use replaceAll() method in jQuery?

replaceAll() method replaces all the selected elements with new HTML elements

e.g. te below code replace all the bold (b) elements with i(italic) elements with the text inside the b tag

<!DOCTYPE html>

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("<i>italic text</i>").replaceAll("b");
});
});
</script>
</head>
<body>

<button>Replace all b(bold) elements with i(italic) elements</button><br>

<p>This is a <b>bold text</b>.This is another <b>bold text</b>.</p>
</body>
</html>

What is html() method?

html(content) method replaces the contents of the element
e.g.
<!DOCTYPE html>

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#btn1').click(function(){
$('#myspan').html('This is a <i>italic text</i>.This is another <i>italic text</i>.');
});
});
</script>
</head>
<body>
<button id="btn1">Exampleof html(Content)</button>

<span id="myspan">This is a <b>bold text</b>.This is another <b>bold text</b>.</span>

</body>
</html>


When we click on the "Exampleof html(Content)" button , the output becomes
<span id="myspan">This is a <i>italic text</i>.This is another <i>italic text</i>.</span>

This indicates that the inner html content of the span tag has been replaced .
What is replaceWith() method?

replaceWith(content) method literally replaces the original element along with it's contents .

e.g.

<!DOCTYPE html>

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#btn1').click(function(){
$('#myspan').replaceWith('This is a <i>italic text</i>.This is another <i>italic text</i>.');
});
});
</script>
</head>
<body>
<button id="btn1">Exampleof replaceWith(Content)</button>
<span id="myspan">This is a <b>bold text</b>.This is another <b>bold text</b>.</span>

</body>
</html>


When we click on the "Exampleof replaceWith(Content)" button , the output becomes

This is a <i>italic text</i>.This is another <i>italic text</i>. 


This indicates that the original span tag along with it's contents has been replaced.
How to set a value for an element in jQuery?

Generally in jQuery val() method is used to set the value of an attribute which is called on any <input> elements. How ever if it is called on <select> with the <option> value then the passed option would be selected.

Say if it is called on Checkbox or Radiobutton then all the matching Checkboxes and Radiobuttons would be checked.
Found this useful, bookmark this page to the blog or social networking websites. Page copy protected against web site content infringement by Copyscape

 Interview Questions and Answers Categories