Skip to content

Commit b65d9f0

Browse files
Update 20480C_MOD03_DEMO.md
#
1 parent 4a1430e commit b65d9f0

File tree

1 file changed

+14
-15
lines changed

1 file changed

+14
-15
lines changed

Instructions/20480C_MOD03_DEMO.md

Lines changed: 14 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,7 @@ Ensure that you have cloned the 20480C directory from GitHub (**https://github.c
155155
4. Click **ASP.NET Web Application(.NET Framework)**.
156156
5. In the **Name** box, enter **HtmlDOMSample**.
157157
6. In the **Location** box, enter **[Repository root]Allfiles\Mod03\Labfiles\Starter\Exercise 2**, and then click **OK**.
158-
7. In **New ASP.NET Web Application- HtmlDOMSample** dialog box, Select **Empty** and then click **OK**.
158+
7. In **New ASP.NET Web Application- HtmlDOMSample** dialog box, Select **MVC** and then click **OK**.
159159

160160
#### Add the index page
161161

@@ -240,33 +240,32 @@ Ensure that you have cloned the 20480C directory from GitHub (**https://github.c
240240
```
241241
#### Add the JavaScript file
242242

243-
1. Right-click **HtmlDOMSample** point to **Add** and then select **New folder**. Type **Scripts**.
244-
2. Right-click the **Scripts** folder, select **Add**, and then click **New Item**.
245-
3. In the **Add New Item – HtmlDOMSample** dialog box, click **JavaScript File**.
246-
4. In the **Name** box, enter **indexScript.js**.
247-
5. Click **Add**.
248-
6. Open the **indexScript.js** file.
249-
7. To create a **createNode** function that receives the html element name and returns the html element, enter the following code:
243+
1. Right-click the **Scripts** folder, select **Add**, and then click **New Item**.
244+
2. In the **Add New Item – HtmlDOMSample** dialog box, click **JavaScript File**.
245+
3. In the **Name** box, enter **indexScript.js**.
246+
4. Click **Add**.
247+
5. Open the **indexScript.js** file.
248+
6. To create a **createNode** function that receives the html element name and returns the html element, enter the following code:
250249
```javascript
251250
function createNode(element) {
252251
return document.createElement(element);
253252
}
254253
```
255-
8. To create an **append** function that receives the parent and child elements and appends the child to the parent, enter the following code:
254+
7. To create an **append** function that receives the parent and child elements and appends the child to the parent, enter the following code:
256255
```javascript
257256
function append(parent, el) {
258257
return parent.appendChild(el);
259258
}
260259
```
261-
9. Create an **addHobbies** function by adding the following code:
260+
8. Create an **addHobbies** function by adding the following code:
262261
```javascript
263262
function addHobbies () { }
264263
```
265-
10. To get all the inputs with the **hobbiesInput** class into the *const* variable, enter the following code:
264+
9. To get all the inputs with the **hobbiesInput** class into the *const* variable, enter the following code:
266265
```javascript
267266
const inputList = document.querySelectorAll('.hobbiesInput');
268267
```
269-
11. To check that **inputList** contains less than five elements, add new inputs with the **createNode** and **append** functions, and if **inputList** contains more than five elements, remove the event listener, and then enter the following code:
268+
10. To check that **inputList** contains less than five elements, add new inputs with the **createNode** and **append** functions, and if **inputList** contains more than five elements, remove the event listener, and then enter the following code:
270269
```javascript
271270
if (inputList.length < 5) {
272271
@@ -284,17 +283,17 @@ Ensure that you have cloned the 20480C directory from GitHub (**https://github.c
284283
document.getElementById('newHobbyBtn').removeEventListener('click', addHobbies);
285284
}
286285
```
287-
12. On the JavaScript page, to add an event listener on **DOMContentLoaded**, enter the following code:
286+
11. On the JavaScript page, to add an event listener on **DOMContentLoaded**, enter the following code:
288287
```javascript
289288
document.addEventListener('DOMContentLoaded', function (event) {
290289
291290
});
292291
```
293-
13. To get a **newHobbyBtn** button by **getElementById**, add an event listener on the button, and attach an **addHobbies** function, enter the following code:
292+
12. To get a **newHobbyBtn** button by **getElementById**, add an event listener on the button, and attach an **addHobbies** function, enter the following code:
294293
```javascript
295294
document.getElementById('newHobbyBtn').addEventListener('click', addHobbies);
296295
```
297-
14. On the **index.html** page, to the **&lt;Head&gt;** element, add the folowing script tag:
296+
13. On the **index.html** page, to the **&lt;Head&gt;** element, add the folowing script tag:
298297
```html
299298
<script src="/Scripts/indexScript.js"></script>
300299
```

0 commit comments

Comments
 (0)