jQuery кітапханасын жаттығуға арналған практика
Ішінде b тегі бар
барлық p абзацтарын
div тегіне ораңыз.
www класы бар барлық p абзацтарын табыңыз,
олардың басына '!' мәтінін қойыңыз,
содан кейін осы абзацтарға h1-h6 тақырыптарын қосыңыз және
осы абзацтар мен тақырыптарды қызыл түске бояңыз.
Барлық p абзацтарын табыңыз және оларды
сол мазмұны бар div тегіне ауыстырыңыз.
Беттегі барлық чекбокстарды табыңыз және табылғандардың жұптарын бұғаттаңыз.
Барлық
бұғатталмаған
чекбокстарға
'белгіленген' статусын қойыңыз.
#test элементі берілген. Оның тікелей
жоғарғы көршісіне '!' мәтінін, ал төменгі
көршісіне - '?' мәтінін қойыңыз. Есепті бір тізбекпен шешіңіз.
#test элементі берілген. Оның тікелей
жоғарғы және төменгі көршілеріне #test элементінің мәтінін қойыңыз.
#test элементі берілген. Оның жоғарғы көршілерінен
ең жақын абзацты тауып, оған #test элементінің мәтінін қойыңыз.
Беттегі екінші li-ны табыңыз,
оған www класын қосыңыз, оның ішін
i тегіне ораңыз, одан кейін
'сәлем' мәтіні бар li қосыңыз.
Беттегі оныншы li-ны табыңыз,
оның ата-анасын табыңыз, ата-анасының тікелей
жоғарғы көршісін алыңыз, оны
<div class="www"></div> ішіне ораңыз.
www класы жоқ абзацтардан басқа
барлық p абзацтарының соңына олардың
реттік нөмірін қосыңыз.
Барлық p абзацтарын табыңыз және
әрбір абзацтың алдына оның көшірмесін қойыңыз. Көшірмені қызыл түске,
ал бастапқы абзацты жасыл түске бояңыз.
h2-тен тікелей кейін тұрған
p абзацтарын табыңыз
және әрбір абзацты h2-тің
тікелей алдына тұратындай етіп жылжытыңыз.
Барлық бос p абзацтарын
(мәтінсіз) табыңыз және оларға
тікелей жоғарғы көршісінің мәтінін салыңыз.
b тегінің ата-анасына, егер бұл
www класы бар элемент немесе p абзацы
болса, қызыл түс пен
мәтін өлшемін
30px-ге қойыңыз.
Барлық бос p абзацтарына
оларға жоғарыдан ең жақын h2 тегінің мәтінін қойыңыз.
Сандары бар инпуттар берілген. Инпуттарда сол сандардың квадраттары пайда болатындай етіңіз.
#test элементі берілген. Оның басына
тікелей жоғарғы көршісінің мәтінін, ал соңына
- тікелей төменгі көршісінің мәтінін қойыңыз.
#test элементі берілген. Оның екінші жоғарғы көршісін
және оның екінші төменгі көршісін табыңыз. Табылған
элементтер бір-бірінің мәтіндерін алмасатындай етіңіз
(жоғарғы көрші төменгі көршінің мәтінін алады және керісінше).
div элементі берілген.
Оның барлық тікелей ұрпақтарынан тақырып еместерін таңдап,
оларды қызыл түске бояңыз.
Барлық p абзацтарын табыңыз,
оларды қызыл түске бояңыз. Содан кейін табылған
абзацтардың ішінен www класы бар абзацтарды таңдап,
оларға '!' мәтінін қойыңыз.
www класы бар барлық p абзацтарын табыңыз,
оларды қызыл түске бояңыз.
Содан кейін табылған абзацтардың біріншісін таңдап,
оған '!' мәтінін қойыңыз, содан кейін соңғысын таңдап,
оған '?' мәтінін қойыңыз.
Есепті бір тізбекпен шешіңіз.
Барлық p абзацтарын табыңыз,
олардың әрқайсысының соңына өз ішіндегі
мәтіндей мәтінді қойыңыз (яғни абзацтағы мәтін
екі рет жазылады).
Барлық p абзацтарын табыңыз,
олардың әрқайсысының соңына жиындағы
реттік нөмірін қойыңыз.
Сандары бар абзацтар берілген. Олардың әрқайсысының соңына ішіндегі санды оның жиындағы реттік нөміріне көбейткен нәтижені қойыңыз.
p абзацын басқанда
оның тікелей жоғарғы және төменгі көршілерін жойыңыз.
p абзацын басқанда
оның барлық жоғарғы көршілерін бірінші h1-h6 тақырыбына дейін жойыңыз
(яғни сол тақырыптан жоғары тұрған элементтер мен тақырыптың өзін
жоюдың қажеті жоқ).
p абзацын басқанда
оның www класы бар ең жақын төменгі көршісін жойыңыз.
p абзацын басқанда
оның бесінші төменгі көршісін жойыңыз.
p абзацын басқанда
оның бесінші төменгі көршісін жойыңыз, егер бұл
h2 болмаса.
p абзацын басқанда
оның бесінші төменгі көршісін жойыңыз, егер бұл көрші
ішінде b тегі жоқ болса.
p абзацын басқанда
оның бесінші төменгі көршісін жойыңыз, егер бұл көрші
h2-тен тікелей кейін тұрмаса.
#test элементі берілген. Бұл
элементті оның тікелей
төменгі көршісімен орындармен ауыстырыңыз.
#test элементі берілген. Оның
тікелей төменгі көршісінен кейін
біздің элементтің көшірмесін салыңыз.
#test элементі берілген. Бұл
элементті оның www класы бар
ең жақын төменгі көршісімен ауыстырыңыз.
Бір ата-ана ішінде бір h2 пен
басқа h2 арасында тұрған
барлық p абзацтарын табыңыз.
Әрбір p абзацын сырттай
және іштей div-ке ораңыз.
Тікелей ата-анасы div емес
барлық p абзацтарын табыңыз
және олардың әрқайсысын <div class="www"></div> ішіне ораңыз.
Барлық p абзацтарын табыңыз. Егер
ата-анасы www класы бар div болмаса,
ата-анасын жойыңыз (оған unwrap жасаңыз).
Содан кейін ата-анасы жойылған абзацтарды
zzz класы бар div-ке ораңыз.
#test элементінің барлық
ата-аналарын табыңыз және осы ата-аналардың
CSS кластарынан массив құрыңыз.
class атрибуты бар
барлық p абзацтарын табыңыз, және олардың әрқайсысын
табылған абзацтың кластары сияқты кластары бар div-ке ораңыз,
ал әрбір абзацтың кластарын class атрибутымен бірге жойыңыз.
#test ішіндегі барлық p абзацтарын табыңыз,
олардың соңына '!' мәтінін қойыңыз, содан кейін табылғандардан
www класы бар абзацтарды алып тастаңыз және қалғандарға
қызыл түс беріңіз.
Беттегі барлық li-ларды табыңыз,
содан кейін табылғандардың соңынан екіншісінің алдына
'тармақ' мәтіні бар тағы бір li салыңыз.
Беттегі барлық li-ларды табыңыз,
содан кейін табылғандардың аяғынан екінші, үшінші
және төртіншісін таңдап, оларға '!' мәтінін қойыңыз.
#test бар ol-ды табыңыз
және оның ішіндегі барлық li-ларды
кері ретке қойыңыз.
#test элементі берілген. Оның барлық
жоғарғы көршілері мен барлық төменгі көршілерін тауып,
олардың орындарын ауыстырыңыз (яғни элементтен бұрын тұрғанның бәрі
оның артына, ал керісінше артында тұрғанның бәрі алдына түсуі керек).
www класы бар барлық li-ларды алыңыз,
оларды қызыл түске бояңыз, содан кейін
табылғандардың ішінен bbb класы бар li-ларды тауып,
оларды жойыңыз. Барлығын бір тізбекпен шешіңіз.
Беттегі барлық li-ларды алыңыз. Алынғандардың жұптарын
бос етіңіз, ал
тақтарын жойыңыз.
Барлық div тегтерін табыңыз және
олардың биіктігін екі есе арттырыңыз.
Беттегі барлық div-лардың
биіктіктерінің қосындысын табыңыз.
#test элементі үшін www класы бар
ең жақын ата-анасын табыңыз, осы
ата-анасының соңына '!' мәтіні бар абзац қосыңыз.
#test элементін басқанда оның
www класы бар ең жақын ата-анасын табыңыз, осы
ата-ана ішіндегі барлық абзацтарды тауып, оларды
қызыл түске бояңыз.
Беттегі алғашқы 10 li-ны
қызыл түске бояңыз.
Беттегі 5-шіден 10-шыға дейінгі li-ларды
қызыл түске бояңыз.
Беттегі соңғы 10 li-ны табыңыз,
оларды қызыл түске бояңыз.
Содан кейін табылғандардан жұп li-ларды тауып,
оларды іштей b тегіне ораңыз.
Бетте чекбокстар берілген. Олардың қаншасы белгіленгенін санаңыз.
5 чекбокс берілген.
Пайдаланушы олардың екеуін белгілегеннен кейін
барлық чекбокстар бұғатталуы керек.
Барлық белгіленген чекбокстардың күйі белгіленбегенге және керісінше өзгеруін жасаңыз.
Инпут берілген.
value атрибутының мазмұнын
placeholder атрибутына жылжытыңыз,
ал value атрибутын толығымен жойыңыз.
Сілтеме берілген.
Егер href атрибуты http://-тен басталса,
сілтемеге target="_blank" атрибутын қосыңыз.
Сан енгізуге болатын инпут берілген. Осы инпутқа сан енгізіп, фокус жоғалтқан кезде бетте сол нөмірлі чекбокс ізделіп, белгіленуін, ал басқа чекбокстардың белгісіз болатындай етіңіз.
Селект және радио түймелері берілген, радио түймелерінің саны селектегі тармақтар санына тең. Селекте тармақ таңдалғанда, сәйкес радио түймесі автоматты түрде белгіленетіндей етіңіз (іздеу рет бойынша: тізімнің бірінші тармағы - бірінші радио және т.с.с.).