Для доступа к DOM элементам на странице достаточно знать идентификатор элемента, его класс или любые другие отличительные признаки. Другими словами-селекторы.
Например,если средствами jQuery необходимо получить объект элемента-то следует написать:
Предположим у нас есть поле ввода с идентификатором field:
<!--Поле ввода-->
<input type="text" id="field" value="Test string" class="my-class" />
<!--Сам скрипт-->
<script type="text/javascript">
var el=$('#field');
</script>
Вот и всё.Переменная el является объектом поля ввода. Теперь из него можно получить значение поля,его аттрибуты и т.д.
Например:
<script type="text/javascript">
var el_val=$('#field').val();
alert(el_val); /*Выведет Test string*/
</script>
Если нужно наоборот-записать значение в поле-то напишем так:
<script type="text/javascript">
$('#field').val('New value');
/*Теперь в поле ввода будет строка New value*/
</script>
Для обращения к аттрибутам поля следует написать так:
<script type="text/javascript">
var el_class=$('#field').attr('class');
alert(el_class); /*Выведет my-class*/
</script>
И для записи значения в аттрибут код будет примерно таким же, как и с установкой значения, только метод будет другим и нужно будет указать 2 аргумента:
<script type="text/javascript">
$('#field').attr('class','new-class');
</script>
<!--Теперь поле ввода будет выглядеть так-->
<input type="text" id="field" value="Test string" class="new-class" />
Ну и если у элемента нет id, но мы знаем его класс,то обратимся по классу:
var el=$('.my-class');
/*или по самому элементу*/
var el=$('input');
Вот и всё. Если вы разбираетесь в CSS, то для вас не составит труда написать следующее:
var el=$('div.main > input#first');
