Now at this point what we want to do, if we've got both of these things on the screen is, we want to change them both, okay? Now, you might be tempted to change one and then change the other, you found one and then found the other. So if we scroll down, you'll see we've got background, and we've also got logo.png right there. So that or right there allows you to find multiple different strings using a regular expression. We can find all of the images in this document just by saying, I wanna find any jpeg, and I wanna find any png, and any gif.
#VISUAL STUDIO CODE MULTIPLE CURSORS UPDATE#
So what we wanna do is we wanna update both of the paths on these items.
But you can see the path here is not correct. And they're broken because they've been moved over here in our start folder, and now in an images folder. The header image is broken and the background image is broken. So for instance, we have two images in this page, and if we go over to the application they're broken, right? Now, you don't need to know regular expressions to make this work, you just need to know a basic amount. If we said something like input, it's gonna find all the inputs. If I turn this on, we're now looking for regular expression. And we do that by using a regular expression. So in our application here, let's say just for the sake of demonstration, that we're looking for all of the images in this file. > Burke Holland: Here, up in the Find though, I wanna show you something that you can do with Find that's a little more powerful. If you do Command > Shift > F, that actually opens the project-wide find and replace. In our index.html file here, we can find anything with just Command, or Ctrl > F. Of course, you have find and replace, most people are familiar with this idea.
I'm gonna change this back, and let's talk about finding things. > Burke Holland: So that's skipping instances.
And now we can safely say, this is lampColor and we've only got the two values that we're looking for.
#VISUAL STUDIO CODE MULTIPLE CURSORS HOW TO#
You need to know how to skip with multiple cursors. And that skips that instance with the multiple cursors. So what we're gonna do is hit Command > D, and then we're gonna say Command > K, still holding down the Command key, Command > D again. What we want to do though, is we want to skip this second instance. Command > D again, and we get a cursor down below, and I hit the arrow key there so we lost it. So if I come here and select this and say Command > D, it puts a cursor there. You can use Command > D to add one cursor at a time. So we wanna change the first one, we wanna leave the second one the same, and we wanna change the third one. So what we really wanna do here is we wanna change two of them, but not one of them. One of these things is a variable name, and the other one is a reference to an element in the HTML. Now, if you're paying close attention though, you'd notice that what I just did would break the application. And I have changed all three of those instances at one time. I now have a cursor on all of these instances, and I can hit backspace, and then I can type lampColor. I can add a cursor to every single one of these instances with Command > Shift > L. And it's highlighted the colorInput that is down below in the goButton.addEventListener method. It's highlighted the colorInput in document, getElementById. And now you can see it's highlighted, and you can't see it on the projector but it's highlighted the colorInput. So let's say that we wanted to rename this or change this value, this colorInput value to something else. If I put my cursor on colorInput, notice that DS code is highlighting other instances of colorInput here. So for instance here in this file, I'm gonna decrease the font size here so we can get more text on the screen. Once you understand how to use them, you'll start to find places to use them. And so what I wanna show you is some cases in which you would use multiple cursors. Like it's a cool technology, but when do I actually use it? It's kind of like artificial intelligence. Now, multiple cursors are very powerful, but a lot of people have trouble understanding when I should actually use one. > Burke Holland: Another concept that's become very popular in editors over the past few years is the concept of multiple cursors. Transcript from the "Regex Find & Multiple Cursors" Lesson
0 kommentar(er)
