jQuery кітапханасын жаттығуға арналған практика

Задание 1

Ішінде b тегі бар барлық p абзацтарын div тегіне ораңыз.

Задание 2

www класы бар барлық p абзацтарын табыңыз, олардың басына '!' мәтінін қойыңыз, содан кейін осы абзацтарға h1-h6 тақырыптарын қосыңыз және осы абзацтар мен тақырыптарды қызыл түске бояңыз.

Задание 3

Барлық p абзацтарын табыңыз және оларды сол мазмұны бар div тегіне ауыстырыңыз.

Задание 4

Беттегі барлық чекбокстарды табыңыз және табылғандардың жұптарын бұғаттаңыз.

Задание 5

Барлық бұғатталмаған чекбокстарға <a href="/kk/markup/manual/html/attr/checked/">'белгіленген'</a> статусын қойыңыз.

Задание 6

#test элементі берілген. Оның тікелей жоғарғы көршісіне '!' мәтінін, ал төменгі көршісіне - '?' мәтінін қойыңыз. Есепті бір тізбекпен шешіңіз.

Задание 7

#test элементі берілген. Оның тікелей жоғарғы және төменгі көршілеріне #test элементінің мәтінін қойыңыз.

Задание 8

#test элементі берілген. Оның жоғарғы көршілерінен ең жақын абзацты тауып, оған #test элементінің мәтінін қойыңыз.

Задание 9

Беттегі екінші li-ны табыңыз, оған www класын қосыңыз, оның ішін i тегіне ораңыз, одан кейін 'сәлем' мәтіні бар li қосыңыз.

Задание 10

Беттегі оныншы li-ны табыңыз, оның ата-анасын табыңыз, ата-анасының тікелей жоғарғы көршісін алыңыз, оны <div class="www"></div> ішіне ораңыз.

Задание 11

www класы жоқ абзацтардан басқа барлық p абзацтарының соңына олардың реттік нөмірін қосыңыз.

Задание 12

Барлық p абзацтарын табыңыз және әрбір абзацтың алдына оның көшірмесін қойыңыз. Көшірмені қызыл түске, ал бастапқы абзацты жасыл түске бояңыз.

Задание 13

h2-тен тікелей кейін тұрған p абзацтарын табыңыз және әрбір абзацты h2-тің тікелей алдына тұратындай етіп жылжытыңыз.

Задание 14

Барлық бос p абзацтарын (мәтінсіз) табыңыз және оларға тікелей жоғарғы көршісінің мәтінін салыңыз.

Задание 15

b тегінің ата-анасына, егер бұл www класы бар элемент немесе p абзацы болса, қызыл түс пен мәтін өлшемін 30px-ге қойыңыз.

Задание 16

Барлық бос p абзацтарына оларға жоғарыдан ең жақын h2 тегінің мәтінін қойыңыз.

Задание 17

Сандары бар инпуттар берілген. Инпуттарда сол сандардың квадраттары пайда болатындай етіңіз.

Задание 18

#test элементі берілген. Оның басына тікелей жоғарғы көршісінің мәтінін, ал соңына - тікелей төменгі көршісінің мәтінін қойыңыз.

Задание 19

#test элементі берілген. Оның екінші жоғарғы көршісін және оның екінші төменгі көршісін табыңыз. Табылған элементтер бір-бірінің мәтіндерін алмасатындай етіңіз (жоғарғы көрші төменгі көршінің мәтінін алады және керісінше).

Задание 20

div элементі берілген. Оның барлық тікелей ұрпақтарынан тақырып еместерін таңдап, оларды қызыл түске бояңыз.

Задание 21

Барлық p абзацтарын табыңыз, оларды қызыл түске бояңыз. Содан кейін табылған абзацтардың ішінен www класы бар абзацтарды таңдап, оларға '!' мәтінін қойыңыз.

Задание 22

www класы бар барлық p абзацтарын табыңыз, оларды қызыл түске бояңыз. Содан кейін табылған абзацтардың біріншісін таңдап, оған '!' мәтінін қойыңыз, содан кейін соңғысын таңдап, оған '?' мәтінін қойыңыз. Есепті бір тізбекпен шешіңіз.

Задание 23

Барлық p абзацтарын табыңыз, олардың әрқайсысының соңына өз ішіндегі мәтіндей мәтінді қойыңыз (яғни абзацтағы мәтін екі рет жазылады).

Задание 24

Барлық p абзацтарын табыңыз, олардың әрқайсысының соңына жиындағы реттік нөмірін қойыңыз.

Задание 25

Сандары бар абзацтар берілген. Олардың әрқайсысының соңына ішіндегі санды оның жиындағы реттік нөміріне көбейткен нәтижені қойыңыз.

Задание 26

p абзацын басқанда оның тікелей жоғарғы және төменгі көршілерін жойыңыз.

Задание 27

p абзацын басқанда оның барлық жоғарғы көршілерін бірінші h1-h6 тақырыбына дейін жойыңыз (яғни сол тақырыптан жоғары тұрған элементтер мен тақырыптың өзін жоюдың қажеті жоқ).

Задание 28

p абзацын басқанда оның www класы бар ең жақын төменгі көршісін жойыңыз.

Задание 29

p абзацын басқанда оның бесінші төменгі көршісін жойыңыз.

Задание 30

p абзацын басқанда оның бесінші төменгі көршісін жойыңыз, егер бұл h2 болмаса.

Задание 31

p абзацын басқанда оның бесінші төменгі көршісін жойыңыз, егер бұл көрші ішінде b тегі жоқ болса.

Задание 32

p абзацын басқанда оның бесінші төменгі көршісін жойыңыз, егер бұл көрші h2-тен тікелей кейін тұрмаса.

Задание 33

#test элементі берілген. Бұл элементті оның тікелей төменгі көршісімен орындармен ауыстырыңыз.

Задание 34

#test элементі берілген. Оның тікелей төменгі көршісінен кейін біздің элементтің көшірмесін салыңыз.

Задание 35

#test элементі берілген. Бұл элементті оның www класы бар ең жақын төменгі көршісімен ауыстырыңыз.

Задание 36

Бір ата-ана ішінде бір h2 пен басқа h2 арасында тұрған барлық p абзацтарын табыңыз.

Задание 37

Әрбір p абзацын сырттай және іштей div-ке ораңыз.

Задание 38

Тікелей ата-анасы div емес барлық p абзацтарын табыңыз және олардың әрқайсысын <div class="www"></div> ішіне ораңыз.

Задание 39

Барлық p абзацтарын табыңыз. Егер ата-анасы www класы бар div болмаса, ата-анасын жойыңыз (оған unwrap жасаңыз). Содан кейін ата-анасы жойылған абзацтарды zzz класы бар div-ке ораңыз.

Задание 40

#test элементінің барлық ата-аналарын табыңыз және осы ата-аналардың CSS кластарынан массив құрыңыз.

Задание 41

class атрибуты бар барлық p абзацтарын табыңыз, және олардың әрқайсысын табылған абзацтың кластары сияқты кластары бар div-ке ораңыз, ал әрбір абзацтың кластарын class атрибутымен бірге жойыңыз.

Задание 42

#test ішіндегі барлық p абзацтарын табыңыз, олардың соңына '!' мәтінін қойыңыз, содан кейін табылғандардан www класы бар абзацтарды алып тастаңыз және қалғандарға қызыл түс беріңіз.

Задание 43

Беттегі барлық li-ларды табыңыз, содан кейін табылғандардың соңынан екіншісінің алдына 'тармақ' мәтіні бар тағы бір li салыңыз.

Задание 44

Беттегі барлық li-ларды табыңыз, содан кейін табылғандардың аяғынан екінші, үшінші және төртіншісін таңдап, оларға '!' мәтінін қойыңыз.

Задание 45

#test бар ol-ды табыңыз және оның ішіндегі барлық li-ларды кері ретке қойыңыз.

Задание 46

#test элементі берілген. Оның барлық жоғарғы көршілері мен барлық төменгі көршілерін тауып, олардың орындарын ауыстырыңыз (яғни элементтен бұрын тұрғанның бәрі оның артына, ал керісінше артында тұрғанның бәрі алдына түсуі керек).

Задание 47

www класы бар барлық li-ларды алыңыз, оларды қызыл түске бояңыз, содан кейін табылғандардың ішінен bbb класы бар li-ларды тауып, оларды жойыңыз. Барлығын бір тізбекпен шешіңіз.

Задание 48

Беттегі барлық li-ларды алыңыз. Алынғандардың жұптарын бос етіңіз, ал тақтарын жойыңыз.

Задание 49

Барлық div тегтерін табыңыз және олардың биіктігін екі есе арттырыңыз.

Задание 50

Беттегі барлық div-лардың биіктіктерінің қосындысын табыңыз.

Задание 51

#test элементі үшін www класы бар ең жақын ата-анасын табыңыз, осы ата-анасының соңына '!' мәтіні бар абзац қосыңыз.

Задание 52

#test элементін басқанда оның www класы бар ең жақын ата-анасын табыңыз, осы ата-ана ішіндегі барлық абзацтарды тауып, оларды қызыл түске бояңыз.

Задание 53

Беттегі алғашқы 10 li-ны қызыл түске бояңыз.

Задание 54

Беттегі 5-шіден 10-шыға дейінгі li-ларды қызыл түске бояңыз.

Задание 55

Беттегі соңғы 10 li-ны табыңыз, оларды қызыл түске бояңыз. Содан кейін табылғандардан жұп li-ларды тауып, оларды іштей b тегіне ораңыз.

Задание 56

Бетте чекбокстар берілген. Олардың қаншасы белгіленгенін санаңыз.

Задание 57

5 чекбокс берілген. Пайдаланушы олардың екеуін белгілегеннен кейін барлық чекбокстар бұғатталуы керек.

Задание 58

Барлық белгіленген чекбокстардың күйі белгіленбегенге және керісінше өзгеруін жасаңыз.

Задание 59

Инпут берілген. value атрибутының мазмұнын placeholder атрибутына жылжытыңыз, ал value атрибутын толығымен жойыңыз.

Задание 60

Сілтеме берілген. Егер href атрибуты http://-тен басталса, сілтемеге target="_blank" атрибутын қосыңыз.

Задание 61

Сан енгізуге болатын инпут берілген. Осы инпутқа сан енгізіп, фокус жоғалтқан кезде бетте сол нөмірлі чекбокс ізделіп, белгіленуін, ал басқа чекбокстардың белгісіз болатындай етіңіз.

Задание 62

Селект және радио түймелері берілген, радио түймелерінің саны селектегі тармақтар санына тең. Селекте тармақ таңдалғанда, сәйкес радио түймесі автоматты түрде белгіленетіндей етіңіз (іздеу рет бойынша: тізімнің бірінші тармағы - бірінші радио және т.с.с.).