Jquery - урок 5

Предишен ◈ Следващото

Първо, помислете за основните техники на работа с HTML. и след това методи за работа с тези елементи. Така че, основните методи:

HTML (Val) - добавяне на HTML код в избраните елементи.
например:

Тази инструкция ще добави към всички DIV-а с SP клас, обхващат-и с текст "Hello".

текст () / Val () - връща стойността на текстови елемент / елемент съдържание.
например:

Тази инструкция се връща текста на параграфа.

текст (Val) / Val (Val) - за да настроите текста за т / стойността на елемента.
например:

Това твърдение в параграф напишете думата "здравей".

Да вземем за пример, направете го, като кликнете върху "Повторение", текстът на първия параграф се дублира във втория параграф.

Първият параграф!

Fuktsii ще изглежда така:

Т.е. първата променлива TP1 пишем текстовото съдържание на първия параграф (първа линия), а след това преминава във втория параграф (втора линия).

Сега нека да разгледаме методите, които ви позволяват да манипулират може да бъде поставена на елемента.

добавете (съдържание) - добавя съдържание в цялата избрания елемент след съществуващото съдържание.
например:

Тази инструкция ще добави до края на параграфа текста "Hello" с удебелен шрифт.

appendTo (съдържание) - операция на обратен, добавя съдържание на всички избрани елементи.
например:

Тази инструкция ще се добави параграф, до края на елемента с "основната" идентификатор.

С други думи:
$ (A) .append (B) - Добавяне към края на А.
$ (A) .appendTo (B) - добавете към края на V.

Вмъкване (съдържание) - добавя съдържание във всички избрания елемент към съществуващото съдържание.
например:

В тях ще се вмъкнете в началото на текста на параграф "Hello" с удебелен шрифт.

prependTo (съдържание) - операция на обратен, добавя съдържание на всички избрани елементи.
например:

В тях ще се вмъкнете точка до върха на елемента с идентификатор "основната".

С други думи:
$ (A) .prepend (B) - Добавяне към върха на А.
$ (A) .prependTo (B) - ще се добавят към горната част A V.

след (съдържание) - добавя съдържание в края на краищата, избрани елементи (Забележка След като елемент, а не в края на члена, както в случая на Добавяне на.
например:

Тези инструкции след параграф текст "Hello" с удебелен шрифт се вмъкват.

Befor (съдържание) - добавя съдържание за всички избрани елементи (бележка към елемент, а не в началото на члена, като в случай, че се постави на.
например:

Тези инструкции се вмъкват преди параграф текста "Hello" с удебелен шрифт.

insertAfter (съдържание) - вмъква всички избрани елементи като съдържанието СЛЕД.
например:

Това твърдение вмъква параграф след елемента с идентификатор "основната".

С други думи:
$ (A) .След (B) - поставете B след А.
$ (A) .insertAfter (B) - поставете След V.

insertBefore (съдържание) - Вмъква всички избрани елементи, преди съдържание-то.
например:

Това ръководство вложка раздел предходния елемент с "основната" идентификатор.

С други думи:
$ (А) .Преди (В) - вмъква в предната част А.
$ (А) .insertBefore (В) - Поставете на B.

Помислете за пример. Нека да се гарантира, че жълтите квадратчета (един клик - една клетка) се появява, когато щракнете върху бутона "Добави" в червения правоъгълник.

Код HTML-страници се състои от DIV-а и един бутон:

Style.css на страницата, както винаги определя стила:

Е, функционалният код е много кратък:

функция addYellowSquare ()<$("#red_sk").prepend("

Това е толкова просто. Но ние ще продължим да считат себе си методи:

увийте (HTML) - обвива всяка точка в член разгънатата.
например:

Това ръководство ще завърши всеки параграф педя-ти.

wrapAll (HTML) - обгръща всички елементи в един елемент обвивка.
например:

Това ръководство ще завърши всички параграфи една педя-ти.

Това ръководство ще предостави съдържанието на всяка точка в курсив.

replaceWith (съдържание) - замества някои други елементи.
например:

Това ръководство ще замени всички педя-ите DIV-а.

replaceAll (селектор) - операция на обратен, т.е. всички селектор-ите ще се промени на елементите.
например:

Това ръководство ще замени всички DIV-а-а от време.

празен () - премахва елемента на всички деца възли, включително текст.
например:

Тези инструкции ще изтрие цялото съдържание на педя-те.

премахнете () - премахва самите елементи.
например:

Тези инструкции ще изтрие всички педя-ите.

клонинг () - клонове елементи.
например:

Това ръководство ще вземе изделията с удебелен шрифт и да го добавите в DIV.

В последния пример, ние сме докоснати от друг аспект на JQuery, а именно в подкрепа на тази библиотека кол вериги. Т.е. можете да се обадите няколко метода в един ред, като ги разделите. удобно ли е? Това зависи от вас. Ако това се обърква не го направите, използвайте върху здравето. В бъдеще, ние често ще използвате този тип запис.

И накрая, нека да вземем друг пример. Да предположим, че имаме списък с някои от тях, и ние искаме да се даде възможност на потребителите да добавят елементи към него:

Градът ни:

Архангелск
Москва
Иркутск

Пълен списък: JQuery HTML

Градът ни:

Архангелск
Москва
Иркутск

Пълен списък:

Просто ей така, можете да направите много неща с помощта на JQuery. Вече знаете достатъчно, за да се опитаме да направим нещо сами, с помощта на изследваните методи. Например, опитайте се да се направи шахматна дъска (8 х 8 клетки, за тези, които не си спомням), и следващия път разгледаме как това може да бъде направено.

Ако този сайт е полезен за вас, можете да помогнете в развитието му като поставя една от тези връзки към вашия сайт.

Свързани статии