Javascript метод document.getelementsbyclassname()

Определение и применение

JavaScript метод getElementsByClassName() объекта Element возвращает живую коллекцию HTMLCollection элементов с заданным именем тега, поиск элементов при этом ведется внутри указанного элемента.

Обращаю Ваше внимание на то, что если Вам необходимо произвести поиск каждого элемента, который имеет указанное имя тега внутри всего документа, а не внутри определенного элемента, то вы можете воспользоваться одноименным методом getElementsByClassName() объекта Document. Объект NodeList представляет коллекцию узлов, которые могут быть доступны по индексным номерам (индекс начинается с 0)

Вы можете использовать свойство length объекта NodeList для определения количества элементов с указанным именем класса. Если искомые элементы отсутствуют, то значение length будет соответствовать значению 0

Объект NodeList представляет коллекцию узлов, которые могут быть доступны по индексным номерам (индекс начинается с 0). Вы можете использовать свойство length объекта NodeList для определения количества элементов с указанным именем класса. Если искомые элементы отсутствуют, то значение length будет соответствовать значению 0.

JavaScript

JS Array
concat()
constructor
copyWithin()
entries()
every()
fill()
filter()
find()
findIndex()
forEach()
from()
includes()
indexOf()
isArray()
join()
keys()
length
lastIndexOf()
map()
pop()
prototype
push()
reduce()
reduceRight()
reverse()
shift()
slice()
some()
sort()
splice()
toString()
unshift()
valueOf()

JS Boolean
constructor
prototype
toString()
valueOf()

JS Classes
constructor()
extends
static
super

JS Date
constructor
getDate()
getDay()
getFullYear()
getHours()
getMilliseconds()
getMinutes()
getMonth()
getSeconds()
getTime()
getTimezoneOffset()
getUTCDate()
getUTCDay()
getUTCFullYear()
getUTCHours()
getUTCMilliseconds()
getUTCMinutes()
getUTCMonth()
getUTCSeconds()
now()
parse()
prototype
setDate()
setFullYear()
setHours()
setMilliseconds()
setMinutes()
setMonth()
setSeconds()
setTime()
setUTCDate()
setUTCFullYear()
setUTCHours()
setUTCMilliseconds()
setUTCMinutes()
setUTCMonth()
setUTCSeconds()
toDateString()
toISOString()
toJSON()
toLocaleDateString()
toLocaleTimeString()
toLocaleString()
toString()
toTimeString()
toUTCString()
UTC()
valueOf()

JS Error
name
message

JS Global
decodeURI()
decodeURIComponent()
encodeURI()
encodeURIComponent()
escape()
eval()
Infinity
isFinite()
isNaN()
NaN
Number()
parseFloat()
parseInt()
String()
undefined
unescape()

JS JSON
parse()
stringify()

JS Math
abs()
acos()
acosh()
asin()
asinh()
atan()
atan2()
atanh()
cbrt()
ceil()
clz32()
cos()
cosh()
E
exp()
expm1()
floor()
fround()
LN2
LN10
log()
log10()
log1p()
log2()
LOG2E
LOG10E
max()
min()
PI
pow()
random()
round()
sign()
sin()
sqrt()
SQRT1_2
SQRT2
tan()
tanh()
trunc()

JS Number
constructor
isFinite()
isInteger()
isNaN()
isSafeInteger()
MAX_VALUE
MIN_VALUE
NEGATIVE_INFINITY
NaN
POSITIVE_INFINITY
prototype
toExponential()
toFixed()
toLocaleString()
toPrecision()
toString()
valueOf()

JS OperatorsJS RegExp
constructor
compile()
exec()
g
global
i
ignoreCase
lastIndex
m
multiline
n+
n*
n?
n{X}
n{X,Y}
n{X,}
n$
^n
?=n
?!n
source
test()
toString()

(x|y)
.
\w
\W
\d
\D
\s
\S
\b
\B
\0
\n
\f
\r
\t
\v
\xxx
\xdd
\uxxxx

JS Statements
break
class
continue
debugger
do…while
for
for…in
for…of
function
if…else
return
switch
throw
try…catch
var
while

JS String
charAt()
charCodeAt()
concat()
constructor
endsWith()
fromCharCode()
includes()
indexOf()
lastIndexOf()
length
localeCompare()
match()
prototype
repeat()
replace()
search()
slice()
split()
startsWith()
substr()
substring()
toLocaleLowerCase()
toLocaleUpperCase()
toLowerCase()
toString()
toUpperCase()
trim()
valueOf()

HTML DOM

Почему не приходят сообщения от банков

getElementsByClassName

Возвращает группу элементов (поэтому и Elements), в которых присутствует искомый класс. Отличительная особенность от предыдущего метода — дозволено указать элемент, относительно которого начинать поиск. Это может быть и document — выбирать элементы на всей странице, либо указатель на определённый блок. Например, получим все элементы с классом .da внутри контейнера #go.

После выполнения кода в массиве elems будут содержаться 3 элемента: .one, .two и .three.

Если же требуется получить всё на странице, достаточно сделать так:

К трём элементам выше добавится ещё один — #go (как видно из кода, ему тоже присвоен класс .da).

К сожалению, данный метод не поддерживается в Internet Explorer версии 8 и ниже. Это значит, что все обладатели Windows XP оказываются в пролёте. Можно сделать свою реализацию функции, которая оббежит все теги на странице и отберёт лишь те, className которых соответствует условию, но есть более удобные методы для работы.

querySelector – выбор элемента по CSS селектору

– это метод, который также как осуществляет поиск по CSS селектору, но в отличие от него возвращает не все найденные элементы, а только первый из них.

Синтаксис:

// поиск внутри всего документа
var element = document.querySelector('selector');
// поиск внутри конкретного элемента (elem)
var element = elem.querySelector('selector');

В приведённом коде – это строка, содержащая CSS селектор, в соответствии с которым необходимо найти элемент.

Результат метода аналогичен , но в отличие от него он выполняет это намного быстрее. Это происходит потому, что сразу же останавливает процесс поиска, как только находит соответствующий элемент. В то время как сначала находит все элементы, и только после того как он все их нашёл мы уже можем обратиться к этим элементам и с помощью оператора доступа (квадратные скобки) взять первый из них.

В качестве результата метод возвращает ссылку на объект типа или (если элемент не найден).

Примеры

1. Обратиться к элементу по , значение которого равно :

var pagetitle = document.querySelector('#pagetitle');

2. Выполнить поиск элемента по классу :

var el = document.querySelector('.nav');

3. Обратиться к элементу , находящемуся в теге с классом , который в свою очередь расположен в :

var header = document.querySelector('main div.comments h3');

4. Проверить наличие элемента с классом на странице:

if (document.querySelector('.modal')) {
  // элемент .modal существует
}

Определение и применение

JavaScript метод document.getElementsByName() возвращает коллекцию всех элементов документа с указанным именем (значением атрибута name) в виде объекта NodeList. В коллекцию могут попасть даже те элементы, которые не поддерживают атрибут name. Атрибут name может применяться только в (X)HTML документах.

Объект NodeList автоматически будет обновляться при изменении документа, элементы внутри объекта располагаются в том же порядке, в каком они присутствуют в документе.

Обращаю Ваше внимание на то, что объект NodeList представляет коллекцию узлов, которые могут быть доступны по индексным номерам (индекс начинается с 0). Вы можете использовать свойство length объекта NodeList для определения количества элементов с указанным именем класса

Если искомые элементы
отсутствуют, то значение length будет соответствовать значению 0.

querySelectorAll – поиск элементов по CSS селектору

– применяется, когда нужно найти все элементы по CSS селектору внутри страницы или определённого элемента.

Синтаксис:

// elements1, elements2 – переменные, в которые будут помещены коллекции найденных элементов

// поиск внутри всего документа
const elements1 = document.querySelectorAll('css_selector');
// поиск внутри элемента (elem)
const elements2 = elem.querySelectorAll('css_selector');

В приведённом коде – это строка, содержащая CSS селектор, в соответствии с которым необходимо осуществить поиск элементов.

возвращает все найденные элементы в виде статической коллекции типа .

Статическая коллекция — это такая, которая не изменяется, если после вызова этого метода на странице появились новые элементы, подходящие под указанный CSS селектор. В этом случае, чтобы в сформированную коллекцию попали новые элементы их выбор нужно выполнить заново.

Узнать количество элементов в коллекции можно с помощью свойства :

// выберем все элементы с type="submit" на странице
const submitList = document.querySelectorAll('');
// узнаем количество найденных элементов
const submitLength = submitList.length;

Обратиться к определённому элементу в коллекции можно по его индексу. Индексы начинаются с 0.

// получим первый элемент из submitList
const submit1 = submitList;
// получим второй элемент из submitList
const submit2 = submitList;

В этом случае возвращается DOM элемент находящийся под указанным индексом в коллекции или , если элемента с таким индексом нет.

Перебрать коллекцию выбранных элементов можно с помощью :

// получим все элементы p на странице
const paragraphList = document.querySelectorAll('p');
// переберём полученную коллекцию элементов с помощью цикла for
for (let i=0, length = paragraphList.length; i < length; i++) {
  // paragraphList - i-ый элемент
}

Перебор элементов посредством :

// например, переберём все элементы html страницы (в CSS для выбора всех элементов используется символ *)
// выберем все изображения на странице
const all = document.querySelectorAll('*');
// выведем все найденные DOM элементы в консоль
for (let elem of all) {
  console.log(elem);
}

Примеры

1. Выполним проверку существование элементов с атрибутом :

if (document.querySelectorAll('').length) {
  // на странице данные элементы есть в наличии
}

2. Найти все элементы внутри элемента с классом :

const anchors = document.querySelectorAll('ul.nav a');

10) addEvent()

Несомненно, важнейший инструмент в управлении событиями! Вне зависимости от того, какой версией вы пользуетесь и кем она написана, она делает то, что написано у неё в названии: присоединяет к элементу обработчик события.

function addEvent(elem, evType, fn) {
	if (elem.addEventListener) {
		elem.addEventListener(evType, fn, false);
	}
	else if (elem.attachEvent) {
		elem.attachEvent('on' + evType, fn)
	}
	else {
		elem = fn
	}
}

Этот код обладает двумя достоинствами — он простой и кросс-браузерный.

Основной его недостаток — в том, он не передает в обработчик для IE. Точнее, этого не делает .

Для передачи правильного this можно заменить соответствующую строку на:

elem.attachEvent("on"+evType, function() { fn.apply(elem) })

Это решит проблему с передачей , но обработчик никак нельзя будет снять, т.к. должен вызывать в точности ту функцию, которая была передана .

Существует два варианта обхода проблемы:

1. Возвращать функцию, использованную для назначения обработчика:

   function addEvent(elem, evType, fn) {
   	if (elem.addEventListener) {
   		elem.addEventListener(evType, fn, false)
                   return fn
   	}
   
           iefn = function() { fn.call(elem) } 
           elem.attachEvent('on' + evType, iefn)
   	return iefn
   }
   
   function removeEvent(elem, evType, fn) {
   	if (elem.addEventListener) {
   		elem.removeEventListener(evType, fn, false)
                   return
   	}
    
           elem.detachEvent('on' + evType, fn)
   }
   

   Используется так:

   function handler() { 
       alert(this) 
   }
   var fn = addEvent(elem, "click", handler)
   ...
   removeEvent(elem, "click", fn)
   

2. Можно не использовать в обработчике события вообще, а передавать элемент через замыкание:

   function handler() { 
      // используем не this, а переменную, ссылающуюся на элемент
       alert(*!*elem*/!*) 
   }
   ...
   

В качестве альтернативы и для примера более серьезной библиотеки обработки событий вы можете рассмотреть статью Кросс-браузерное добавление и обработка событий.

More Examples

Example

Change the background color of the second element with class=»child» inside of a <div> element:

var x =
document.getElementById(«myDIV»);x.getElementsByClassName(«child»).style.backgroundColor = «red»;

Example

Find out how many elements with class=»child» there are inside of a <div>
element (using the length
property of the NodeList object):

var x =
document.getElementById(«myDIV»).getElementsByClassName(«child»).length;

Example

Change the background color of the first element with both the «child» and
«color» class inside of an element with class=»example»:

var x = document.getElementsByClassName(«example»);
x.getElementsByClassName(«child color»).style.backgroundColor = «red»;

Example

Change the background color of all elements with class=»child» inside of a
<div> element:

var x = document.getElementById(«myDIV»);var y = x.getElementsByClassName(«child»);var i;for (i = 0; i < y.length; i++) {  y.style.backgroundColor = «red»;}

Методы интерфейса Document

Метод	Описание	Chrome	Firefox	Opera	Safari	IExplorer	Edge
adoptNode()	Метод позволяет принять узел из любого документа, частью которого он являлся на момент вызова, и записывает в свойство Node.ownerDocument ссылку на текущий документ, подготавливая его к добавлению в текущий документ.	Да	Да	Да	Да	9.0	Да
close()	Метод завершает запись в документ (закрывает поток открытый с помощью метода open() объекта Document)	Да	Да	Да	Да	Да	Да
createAttribute()	Метод создает новый атрибут с указанным именем (объект Attr) и возвращает его.	Да	Да	Да	Да	Да	Да
createCDATASection()	Создает узел CDATASection и возвращает его (только для XML документов).	Да	Да	Да	Да	Да	Да
createComment()	Позволяет создать новый узел комментария и возвратить его.	Да	Да	Да	Да	Да	Да
createDocumentFragment()	Позволяет создать новый пустой объект DocumentFragment, предназначенный для создания фрагмента документа, в который впоследствии допускается добавить новые элементы и узлы, а затем присоединить этот фрагмент к основному дереву DOM.	Да	Да	Да	Да	Да	Да
createElement()	Метод позволяет создать и вернуть новый элемент (пустой узел Element) с указанным именем тега.	Да	Да	Да	Да	Да	Да
createElementNS()	Метод позволяет создать и вернуть новый элемент (пустой узел Element) с указанным именем тега с указанным URI пространства имен.	Да	Да	Да	Да	Да	Да
createEvent()	Метод создает событие указанного типа.	Да	Да	Да	Да	9.0	Да
createNodeIterator()	Возвращает новый объект NodeIterator.	Да	Да	Да	Да	9.0	Да
createTextNode()	Метод позволяет создать и вернуть текстовый узел с указанным текстом.	Да	Да	Да	Да	Да	Да
getElementById()	Метод возвращает объект Element, представляющий из себя элемент, глобальный атрибут id которого соответствует указанной строке.	Да	Да	Да	Да	Да	Да
getElementsByClassName()	Возвращает массивоподобный (итерируемый) объект всех дочерних элементов, которые соответствуют указанному имени классу, или классам.	Да	Да	Да	Да	Да	Да
getElementsByName()	Метод возвращает коллекцию всех элементов документа с указанным именем (значением атрибута name) в виде объекта NodeList.	Да	Да	Да	Да	Да	Да
getElementsByTagName()	Метод возвращает коллекцию всех элементов документа с указанным именем тега в виде объекта HTMLCollection.	Да	Да	Да	Да	Да	Да
getElementsByTagNameNS()	Метод возвращает коллекцию всех элементов документа с указанным именем тега в виде объекта NodeList, принадлежащих определенному пространству имен	Да	Да	Да	Да	Да	Да
hasFocus()	Метод возвращает логическое значение, которое указывает на то, имеет ли документ, или любой элемент внутри документа фокус.	Да	Да	Да	Да	Да	Да
importNode()	Метод создает новую копию указанного узла (объект Node) или фрагмента (объект DocumentFragment) из другого документа для возможности вставки в текущий документ.	Да	Да	Да	Да	9.0*	Да
open()	Метод позволяет открыть поток для записи документа (данные могут быть переданы с помощью методов write() или writeln() объекта Document).	Да	Да	Да	Да	Да	Да
querySelector()	Метод возвращает первый элемент в документе (объект Element), соответствующий указанному селектору, или группе селекторов.	Да	Да	Да	Да	8.0*	Да
querySelectorAll()	Метод возвращает список элементов в пределах документа (статичный (не живой) объект типа NodeList), соответствующих указанному селектору, или группе селекторов.	Да	Да	Да	Да	8.0*	Да
write()	Записывает в поток документа строку текста.	Да	Да	Да	Да	Да	Да
writeln()	Записывает в поток документа строку текста за которой следует символ новой строки.	Да	Да	Да	Да	Да	Да

Как передать данные в другой тег по id при onclick

уникальным идентификаторомid<div id=»demo»></div>

Далее нам понадобится скрипт, который по нажатию, отправит какие-то данные в этот див:

<button onclick=»getElementById(‘demo’).innerHTML = Date()»>Сколько времени!?</button>
Сколько времени!?тегу

Как вызвать функцию по клику, как мы уже раньше говорили, что click можно вызвать
1). В первом случае меняем слово alert на название функции, а в скобках идущих после alert убираем содержимое…

В функции прописываем что-то…

<script> function my_super_foo(){alert(«Вызов функции в теге… по клику»); }</script>

<button onclick=»my_super_foo()»>Вызов функции в теге… по клику</button>

Результат вызова функции из тега

Вызов функции в теге… по клику2). Второй способ… идем во встрой способ… там даже и переделывать ничего не нужно… заменяем только само действие в внутри функции priner_id .innerHTML =»НОВЫЙ ТЕКСТ»; — готовый способ вызова функции по клику…
3). Третий способ аналогичен второму… копируем все, что описано в третье пункте, заменяем внутри функции на ваше действие…

В качестве примера рекомендую — страницу с кнопками — все события производится именно кнопками, на которых повешено событие onclick.

1). Как повесить на одну кнопку сразу две функции!? Или три!? Или четыре… так можно продолжать до бесконечности:

Если говорить о двух событиях на onclick, то во всех , кроме первого(в теге) — этот вопрос кажется немного странным! Почему!? Просто во внутрь функции ставишь не одно событие, а столько сколько захочешь!

Если говорить об onclick два события в теге, то внутри onclick прописываем стандартные действия как в js

<button onclick=»getElementById(‘demo’).innerHTML = Date();alert(‘Щелчок мыши!’)»>Два события.</button>

<kod id=»demo»></kod>

Два события.

2). Если мы возьмем и сделаем функцию, обрабатывающую нажатие на кнопку…, то там тоже нет никакой проблемы повесить на кнопку два, три, пять, 100 функций!

<button id=»new_id»>Две функции onclick на одну кнопку js</button>

<script>

new_id .addEventListener(«click», myFoo);

function myFoo()

{

alert(«одна функция onclick на одну кнопку js»);

alert(«Две функции onclick на одну кнопку js»);

alert(«Три функции onclick на одну кнопку js»);

}

</script>

Две функции onclick на одну кнопку js

Если , например нужно изменить где-то цвет, то можно посмотреть пример с помощью onclick

Код:

<button onclick=»getElementById(‘rezult’).setAttribute(‘style’, ‘color: red;’);»>Изменить цвет</button>

<div id=»rezult»>Здесь текст, который будет менять при нажатии</div>

Результат:

Изменить цвет
Здесь текст, который будет менять при нажатии

4.

Например, когда надо много событий навесить в onclick, то можно навесить на onclick только функцию, а в функции написать функцию, которая и будет выполнять все, что нужно при нажатии на кнопку…

Далее изменение текста и одновременное изменение цвета.

Код:

далее скрипт, либо можно выделить в отдельный файл скрипта…

<script> function foo() { 

document.getElementById(«rezult_1»).innerHTML = «привет»; 

document.getElementById(«rezult_1»).setAttribute(«style»,  «color: red»  ); 

}    

</script>

Результат:

Нажми здесь

Здесь текст, который будет менять при нажатии

8) getElementsByClass()

Изначально не написана никем конкретно. Многие разработчики писали свои собственные версии и ничья не показала себя лучше остальных.

Следующая функция использует встроенный метод , если он есть, и ищет элементы самостоятельно в тех браузерах, где этого метода нет.

if(document.getElementsByClassName) {

	getElementsByClass = function(classList, node) {    
		return (node || document).getElementsByClassName(classList)
	}

} else {

	getElementsByClass = function(classList, node) {			
		var node = node || document,
		list = node.getElementsByTagName('*'), 
		length = list.length,  
		classArray = classList.split(/\s+/), 
		classes = classArray.length, 
		result = [], i,j
		for(i = 0; i < length; i++) {
			for(j = 0; j < classes; j++)  {
				if(list.className.search('\\b' + classArray + '\\b') != -1) {
					result.push(list)
					break
				}
			}
		}
	
		return result
	}
}

classList

Список классов, разделенный пробелами, элементы с которыми нужно искать.

node

Контекст поиска, внутри какого узла искать

Например:

var div = document.getElementById("mydiv")
elements = getElementsByClass('class1 class2', div)

getElementById

Самый простой метод, знакомый, пожалуй, каждому. Для получения ссылки на элемент достаточно выполнить простой запрос:

После этого elem будет содержать ссылку на элемент с идентификатором #go (у нас это <div id=»go»>). Теперь можно совершать различные манипуляции, например, изменить цвет на красный:

Важно! Атрибут id должен быть уникальным для всей страницы. Если вы решите присвоить двум элементам одинаковый идентификатор, фунция всё равно вернёт 1 элемент

Какой? Зависит от многих факторов. Ключевой момент — вы не можете быть уверены, что получите определённый объект. Поэтому примите за правило: id обязан быть уникальным.

Метод применим только к объекту document. Просто запомните вызов метода: document.getElementById(id).

Определение и применение

JavaScript метод document.getElementsByClassName() возвращает массивоподобный (итерируемый) объект (NodeList) всех дочерних элементов, которые соответствуют указанному имени классу, или классам (глобальный атрибут class которых соответствует указанной строке). Объект NodeList автоматически будет обновляться при изменении документа, элементы внутри объекта располагаются в том же порядке, в каком они присутствуют в документе.

Обращаю Ваше внимание на то, что объект NodeList представляет коллекцию узлов, которые могут быть доступны по индексным номерам (индекс начинается с 0). Вы можете использовать свойство length объекта NodeList для определения количества элементов с указанным именем класса

Если искомые элементы
отсутствуют, то значение length будет соответствовать значению 0.

Метод getElementsByClassName() также определен в объекте Element, по этой причине он может быть вызван на любом элементе, не только на объекте document. Элемент на котором он вызывается будет использован в качестве корневого элемента для поиска.

JavaScript

JS Array
concat()
constructor
copyWithin()
entries()
every()
fill()
filter()
find()
findIndex()
forEach()
from()
includes()
indexOf()
isArray()
join()
keys()
length
lastIndexOf()
map()
pop()
prototype
push()
reduce()
reduceRight()
reverse()
shift()
slice()
some()
sort()
splice()
toString()
unshift()
valueOf()

JS Boolean
constructor
prototype
toString()
valueOf()

JS Classes
constructor()
extends
static
super

JS Date
constructor
getDate()
getDay()
getFullYear()
getHours()
getMilliseconds()
getMinutes()
getMonth()
getSeconds()
getTime()
getTimezoneOffset()
getUTCDate()
getUTCDay()
getUTCFullYear()
getUTCHours()
getUTCMilliseconds()
getUTCMinutes()
getUTCMonth()
getUTCSeconds()
now()
parse()
prototype
setDate()
setFullYear()
setHours()
setMilliseconds()
setMinutes()
setMonth()
setSeconds()
setTime()
setUTCDate()
setUTCFullYear()
setUTCHours()
setUTCMilliseconds()
setUTCMinutes()
setUTCMonth()
setUTCSeconds()
toDateString()
toISOString()
toJSON()
toLocaleDateString()
toLocaleTimeString()
toLocaleString()
toString()
toTimeString()
toUTCString()
UTC()
valueOf()

JS Error
name
message

JS Global
decodeURI()
decodeURIComponent()
encodeURI()
encodeURIComponent()
escape()
eval()
Infinity
isFinite()
isNaN()
NaN
Number()
parseFloat()
parseInt()
String()
undefined
unescape()

JS JSON
parse()
stringify()

JS Math
abs()
acos()
acosh()
asin()
asinh()
atan()
atan2()
atanh()
cbrt()
ceil()
clz32()
cos()
cosh()
E
exp()
expm1()
floor()
fround()
LN2
LN10
log()
log10()
log1p()
log2()
LOG2E
LOG10E
max()
min()
PI
pow()
random()
round()
sign()
sin()
sqrt()
SQRT1_2
SQRT2
tan()
tanh()
trunc()

JS Number
constructor
isFinite()
isInteger()
isNaN()
isSafeInteger()
MAX_VALUE
MIN_VALUE
NEGATIVE_INFINITY
NaN
POSITIVE_INFINITY
prototype
toExponential()
toFixed()
toLocaleString()
toPrecision()
toString()
valueOf()

JS OperatorsJS RegExp
constructor
compile()
exec()
g
global
i
ignoreCase
lastIndex
m
multiline
n+
n*
n?
n{X}
n{X,Y}
n{X,}
n$
^n
?=n
?!n
source
test()
toString()

(x|y)
.
\w
\W
\d
\D
\s
\S
\b
\B
\0
\n
\f
\r
\t
\v
\xxx
\xdd
\uxxxx

JS Statements
break
class
continue
debugger
do…while
for
for…in
for…of
function
if…else
return
switch
throw
try…catch
var
while

JS String
charAt()
charCodeAt()
concat()
constructor
endsWith()
fromCharCode()
includes()
indexOf()
lastIndexOf()
length
localeCompare()
match()
prototype
repeat()
replace()
search()
slice()
split()
startsWith()
substr()
substring()
toLocaleLowerCase()
toLocaleUpperCase()
toLowerCase()
toString()
toUpperCase()
trim()
valueOf()