1
00:00:02,400 --> 00:00:06,450
So we learned about a lot of different insertion and removal methods,

2
00:00:06,780 --> 00:00:10,590
let me now summarize the important ones which we used here.

3
00:00:10,740 --> 00:00:16,800
Now I'll not dive into the innerHTML and insert adjacent HTML methods which I also showed you

4
00:00:16,830 --> 00:00:23,100
but focus on the ones where we created a new DOM object programmatically in Javascript. We can then add

5
00:00:23,100 --> 00:00:29,150
such an object with append child, with insert adjacent element, replace child or remove child.

6
00:00:29,160 --> 00:00:34,920
Now I haven't shown you replace child, in the end this also just is a convenient method for replacing

7
00:00:34,920 --> 00:00:41,550
one element with another one. Now attached you also find a detailed summary document which you can

8
00:00:41,550 --> 00:00:45,990
have a look at to find an overview over all the methods you have available and when to use which,

9
00:00:46,140 --> 00:00:49,310
I strongly also recommend having a look at that.

10
00:00:49,480 --> 00:00:57,670
We also had a look at some of the more modern methods - append, prepend, before, after, replace with and

11
00:00:57,670 --> 00:01:02,320
remove. Now the main difference here is really browser support,

12
00:01:02,320 --> 00:01:08,260
also a minor thing might be that you find more examples on the Internet using these older methods which

13
00:01:08,260 --> 00:01:10,460
have been around for longer than for these

14
00:01:10,480 --> 00:01:17,830
newer methods because these have also a good browser support as you saw but some browsers are not supporting

15
00:01:17,860 --> 00:01:18,460
all methods,

16
00:01:18,460 --> 00:01:23,860
for example Safari doesn't support before and after, it supports the other methods but Internet Explorer

17
00:01:23,860 --> 00:01:25,190
is a big problem there.

18
00:01:25,210 --> 00:01:31,270
So this might be an issue if you need to support these browsers and you will also see them a bit less

19
00:01:31,300 --> 00:01:34,530
often used in some of the other tutorials you find on the web

20
00:01:34,780 --> 00:01:37,970
which is why I find it important to learn all of them.

21
00:01:38,170 --> 00:01:43,540
If you want to be super safe regarding support and so on, you want to use the left ones but the right

22
00:01:43,540 --> 00:01:45,090
ones also are pretty good,

23
00:01:45,130 --> 00:01:51,700
mostly if Internet Explorer users are not that important for you and as I already mentioned, later down

24
00:01:51,700 --> 00:01:58,900
in the course, you will also learn how you can actually ensure proper browser support even if you are

25
00:01:58,900 --> 00:02:04,480
using features that are not supported in all browsers out of the box. So you will even learn about ways

26
00:02:04,480 --> 00:02:07,930
of making these methods run in older browsers as well

27
00:02:08,020 --> 00:02:12,160
later down in the course, in the browser support course module.

28
00:02:12,310 --> 00:02:14,530
Now again, check out the attached document as well,

29
00:02:14,530 --> 00:02:17,860
there you find a full list of all the methods you have available for that,

30
00:02:17,950 --> 00:02:19,740
what they do and when to use which

31
00:02:19,840 --> 00:02:22,130
and with that, that should be all, super clear.

32
00:02:22,330 --> 00:02:28,540
Now still, that was a lot of theoretical knowledge now, now it's also time to apply at least some

33
00:02:28,540 --> 00:02:35,050
of these methods and features in a simple project so that we can see how we would use them in a more

34
00:02:35,080 --> 00:02:36,100
realistic app.