-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcontents.html
89 lines (73 loc) · 5.86 KB
/
contents.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html>
<html>
<head>
<title>Jquery-Contents</title>
</head>
<body>
<h1> List of All the Questions! </h1>
<h2> Assignment Submitted By: Pavleen Kaur </h2>
<h3> Newer Id: 4648 </h3>
<ul>
<h3>Ques 1. Console "Hello Word" in document.ready function </h3>
<p> <b> document.ready function </b> detects the readiness of a page. This means if a page is fully ready, i.e. all its script is loaded, then only
it will be rendered on the browser. If there's any error while loading the script, the webpage will not be rendered. </p>
<li><a href="ques1.html">Question 1</a></li>
<h3>Ques 2. Select a ID name "#test" and add class "load" when DOM is loaded</h3>
<p> The <b> addClass() method </b> adds one or more class names to the selected elements.</p>
<p> This method does not remove existing class attributes, it only adds one or more class names to the class attribute.</p>
<p> As shown in the example below, the div element having the id 'test', additionally gets the properties of the class 'load' when DOM is loaded</p>
<li><a href="ques2.html">Question 2</a></li>
<h3>Ques 3. Change the color of element which class name end with "-new" </h3>
<p>To look for the element that ends with certain characaters, following syntax is used. [ <b> $("[name$=val]") </b> // ends with ] </p>
<li><a href="ques3.html">Question 3</a></li>
<h3>Ques 4. Disable submit button using jquery attr method </h3>
<p>To disable a submit button, we just need to add a <b>disabled attribute</b> to the submit button.</p>
<li><a href="ques4.html">Question 4</a></li>
<h3>Ques 5. Change the font size of ".target" which has parent element with id name "#main" </h3>
<p>On clicking the button, font-size of the element, with parent id=main will change. </p>
<li><a href="ques5.html">Question 5</a></li>
<h3>Ques 6. After page load change the HTML of div element with "p" element </h3>
<p><b>.replaceWith( newContent )</b>: Replaces each element in the set of matched elements with the provided new content and return the set of elements that was removed. </p>
<li><a href="ques6.html">Question 6</a></li>
<h3>Ques 7. Bind a click function to an "click" element and append next "click" next to it.</h3>
<p><b>.append()</b> Inserts content, specified by the parameter, to the end of each element in the set of matched elements.
<li><a href="ques7.html">Question 7</a></li>
<h3>Ques 8. Click event not working on element which added dynamicly or via script, make it work using .on method </h3>
<p> The <b> on() method</b> attaches one or more event handlers for the selected elements and child elements. </p>
<li><a href="ques8.html">Question 8</a></li>
<h3>Ques 9. Get dropdown selected value on onchanage event and append in div container</h3>
<p> The change event occurs when the value of an element has been changed (only works on 'input', 'textarea' and 'select' elements).</p>
<p> The <b>change() method</b> triggers the change event, or attaches a function to run when a change event occurs.</b>
<li><a href="ques9.html">Question 9</a></li>
<h3>Ques 10. Create a dropdown menu using hover method in jquery</h3>
<p>The hover() method specifies two functions to run when the mouse pointer hovers over the selected elements.</p>
<p>This method triggers both the mouseenter and mouseleave events.</p>
<li><a href="ques10.html">Question 10</a></li>
<h3>Ques 11. On clicking on "google" tag. It is taking us to google home page. Stop it from happening. </h3>
<p>The <b> preventDefault()</b> method cancels the event if it is cancelable, meaning that the default action that belongs to the event will not occur.</p>
<p>For example, this can be useful when: Clicking on a "Submit" button, prevent it from submitting a form</p>
<li><a href="ques11.html">Question 11</a></li>
<h3>Ques 12. We have bind a click funtion to parent div but we want stop it from performing when user clicks on its child li </h3>
<p>The <b>stopPropagation() method</b> prevents propagation of the same event from being called.</p>
<p>Propagation means bubbling up to parent elements or capturing down to child elements.</p>
<li><a href="ques12.html">Question 12</a></li>
<h3>Ques 13. Get the max height of elements using jquery each method</h3>
<p><b>jQuery.each(): </b>A generic iterator function, which can be used to seamlessly iterate over both objects and arrays. Arrays and array-like objects with a length property (such as a function's arguments object) are iterated by numeric index, from 0 to length-1. Other objects are iterated via their named properties.</p>
<li><a href="ques13.html">Question 13</a></li>
<h3>Ques 14. Chagne color of every cell which has numberl larger than 10.</h3>
<li><a href="ques14.html">Question 14</a></li>
<h3>Ques 15. Retrive the data from server using ajax get call</h3>
<p>The <b>ajax() method</b> is used to perform an AJAX (asynchronous HTTP) request.<br>All jQuery AJAX methods use the ajax() method.
This method is mostly used for requests where the other methods cannot be used </p>
<p>Result is displayed in Console</p>
<li><a href="ques15.html">Question 15</a></li>
<h3>Ques 16. Add cross button on row and bind click function which make a delete request to server, after success event remove the row from dom</h3>
<p>The jQuery <b>remove() method</b> removes the selected element(s) and its child elements.
<p>Result is displayed in Console</p>
<li><a href="ques16.html">Question 16</a></li>
<h3>Ques 17. Create a image array and in div create a slide show to animate images of delay of 500ms.</h3>
<p>The <b>setTimeout() method</b> calls a function or evaluates an expression after a specified number of milliseconds.</p>
<li><a href="ques17.html">Question 17</a></li>
</ul>
</body>
</html>