Course Content
Code editors
In this chapter, you will learn how to use code editors.
0/6
Introduction
01:31
Installing
01:21
Interface
05:37
Extensions
02:14
Customizing
02:25
Tips
05:29
Browser developer tools
In this chapter, you will learn how to use browser developer tools.
0/4
Introduction
00:26
How to inspect elements with the Chrome Developer Tools?
01:30
How to edit elements with the Chrome Developer Tools?
02:15
How to use the Chrome Developer Console?
01:48
Selecting elements
In this chapter, you will learn how to select elements with JavaScript.
0/33
Introduction
00:30
How to select an element with a class?
01:24
How to select an element with multiple classes?
01:28
How to select an element with a class that is a child of an element with a class?
01:26
How to select an element with identifiers?
01:02
How to select the root element?
01:08
How to select an element type?
01:05
How to select an element type that has a class?
01:07
How to select the first element after another element?
01:21
How to select the first child of an element type?
01:08
How to select the last specific element type?
01:13
How to select a specific child counting from the top?
01:00
How to select a specific element type counting from the bottom?
01:09
How to select multiple element types?
01:33
How to select multiple elements inside of elements?
01:31
How to select multiple elements where the parent is another element?
01:12
How to select multiple elements that are preceded by other elements?
01:53
How to select multiple elements containing specific attributes?
01:16
How to select multiple elements containing attributes with specific values?
01:36
How to select multiple elements with an attribute value containing a specific word?
01:43
How to select multiple elements with an attribute value starting with a specific word and hyphen?
01:40
How to select multiple elements with a class that contain a specific word?
02:07
How to select multiple elements with an attribute value starting with a specific word?
01:45
How to select all checked input elements?
01:47
How to select multiple elements with an attribute value ending with a specific word?
01:24
How to select all disabled input fields?
01:43
How to select all enabled input fields?
01:40
How to select all elements that have no children?
01:04
How to flip your selection?
01:25
How to select only children?
01:17
How to select lonely element types?
01:10
How to select all required input fields?
01:35
How to select all optional input fields?
01:29
Manipulating elements
In the chapter, you will learn how to manipulate elements on a webpage with JavaScript.
0/20
Introduction
00:24
How to hide an element without moving the layout?
00:50
How to hide multiple elements without moving the layout?
00:59
How to hide an element while moving the layout?
00:50
How to hide multiple elements while moving the layout?
01:10
How to remove an element from the DOM?
01:23
How to remove multiple elements from the DOM?
01:00
How to replace text?
00:57
How to replace text for multiple elements?
01:03
How to move an element up?
01:44
How to move elements up multiple times?
00:33
How to move an element down?
01:20
How to move elements down multiple times?
00:41
How to remove a dollar symbol?
01:06
How to remove a euro symbol?
01:21
How to remove multiple currency symbols?
01:21
How to change the attributes of elements?
01:19
How to change the attributes of multiple elements?
02:10
How to change CSS with JavaScript?
01:59
How to add an title?
01:51
Conditional changes
In this chapter, you will learn how to run JavaScript code conditionally.
0/7
Introduction
00:28
How to run code on button click?
00:48
How to run code on element existence?
01:25
How to run code on mouse over?
01:16
How to run code on mouse out?
01:12
How to run code when the state of an input field changes?
01:14
How to run code based on the content of the text?
01:38
Regular expressions
In this chapter, you will learn how to write regular expressions to target page paths.
0/8
Introduction
00:34
How to match URLs with one static page path?
01:32
How to match URLs with a variable page path?
01:51
How to match URLs with a numbered page path?
01:42
How to match URLs while including specific words and excluding specific words?
02:11
How to match URLs while excluding specific words?
01:22
How to check page targeting in Google Optimize?
02:05
How to test regular expressions with JavaScript?
04:24
Preventing flickering
In this chapter, you will learn how to prevent flickering when running JavaScript experiments.
0/10
Introduction
00:44
What is an observer function?
00:33
How to write an observer function?
02:04
How to use an observer function?
01:05
What is pre-hiding with CSS?
00:25
How to pre-hide elements with CSS?
01:24
How to reveal hidden elements with JavaScript?
01:12
What are Single Page Applications?
00:28
What is the challenge with Single Page Applications?
00:42
How to create an observer function that pools for element changes on Single Page Applications?
01:32
Running experiments
In this chapter, you will learn how to run JavaScript in an A/B testing tool.
0/9
Introduction
00:21
How to run JavaScript in Convert Experiences?
05:10
How to run JavaScript in ABlyft?
07:04
How to install Google Optimize?
01:51
How to set up an A/B test with JavaScript in Google Optimize?
04:12
How to verify that your Google Optimize A/B test is running?
00:43
How to set up an event-triggered A/B test with Google Optimize?
00:53
How to trigger your event-triggered Google Optimize A/B test with JavaScript?
00:44
How to create a trigger tag in Google Tag Manager?
02:16
JavaScript for Optimizers
About Lesson

HTML

<div>Div 1</div>
<div class="classElement">Div 2</div>
<div>Div 3</div>

JavaScript

let getClassElement = document.querySelector(".classElement");
console.log(getClassElement.innerText);

Console

"Div 2"
Previous
Next
0% Complete