O objeto jQuery em AJAX é interessante porque é fácil de criar a partir de uma variedade de elementos DOM para HTML5 e CSS3 programação, e porque acrescenta maravilhosos, novos recursos para esses elementos.

Como alterar o estilo de um elemento

Se você pode alterar dinamicamente a CSS de um elemento, você pode fazer muita coisa para ele. jQuery torna este processo muito fácil. Depois que você tem um objeto jQuery, você pode usar o css () método para adicionar ou alterar quaisquer atributos CSS do objeto.

O código exibe uma concisão comum ao código jQuery:

 
Eu sou um nível um título
Eu sou um parágrafo com o id "myParagraph."
Eu tenho uma fronteira.
Eu tenho uma borda também.

Você encontra algumas coisas interessantes neste programa. Primeiro, dê uma olhada no HTML:

• Ele contém um tag H1. Isso não é muito excitante, mas você pode usá-lo para mostrar como alvo elementos por tipo DOM.

• Há um parágrafo com o ID myParagraph. Isso será usado para ilustrar como alvo um elemento por ID.

• Há dois elementos com a classe. Você não tem nenhuma maneira fácil no trabalho DOM comum para aplicar código para todos os elementos de uma classe particular, mas jQuery torna mais fácil.

• Vários elementos têm CSS personalizado, mas sem CSS está definido. O código jQuery muda o CSS dinamicamente.

o nisso() função é identificada como a função a ser executada quando o documento está pronto. Nesta função, o método CSS potente é utilizada para alterar CSS de cada elemento de forma dinâmica. Observe como os vários elementos são o alvo.

Como selecionar objetos jQuery

jQuery dá-lhe várias alternativas para a criação de objetos jQuery dos elementos DOM. Em geral, você usa as mesmas regras para selecionar objetos em jQuery como você faz em CSS:

• elementos DOM são visadas como é. Você pode incluir qualquer elemento DOM dentro do $ (# 147- # 148-) mecanismo para direcionar todos os elementos semelhantes. Por exemplo, usar $ (# 147-h1 # 148-) para se referir a todos os objectos ou H1 $ (# 147-p # 148-)para se referir a todos os pontos.

• Use o identificador para atingir um determinado ID. Isto funciona exactamente os mesmos que em CSS. Se você tem um elemento com o ID minha coisa, usar o código $ (# 147-MYTHing # 148-).

• Use o . identificador para atingir membros de uma classe. Novamente, isso é o mesmo mecanismo que você usar em CSS, por isso, todos os elementos com a classe delimitado ligados a eles podem ser modificados com o código $ (# 147-.bordered # 148-).

• Você ainda pode usar identificadores complexos. Você ainda pode usar identificadores CSS complexos como $ (# 147-li img # 148-). Este identificador segmentada somente imagens dentro de um item da lista.

Estes métodos de selecção (todos emprestado de notação CSS familiarizado) adiciona flexibilidade incrível ao seu código. Agora você pode facilmente selecionar elementos em seu código javascript de acordo com as mesmas regras que você usa para identificar elementos em CSS.

Como modificar o estilo

Depois de ter identificado um objeto ou um conjunto de objetos, você pode aplicar métodos do jQuery. Um método muito eficiente e fácil é o método. A forma básica desta css () método tem dois parâmetros: uma regra e estilo valor.

Por exemplo, para tornar a cor de todos os objetos H1 fundo amarelo, utilize o seguinte código:

 $ ( "H1") css ( "backgroundColor", "amarelo"). -

Se você aplicar uma regra de estilo a uma coleção de objetos (como todos os objetos H1 ou todos os objetos com o delimitado classe), a mesma regra é aplicada instantaneamente a todos os objetos.

A mais poderosa variação da regra de estilo existente que permite que você aplique vários estilos CSS ao mesmo tempo. É preciso um único objeto em notação JSON como seu argumento:

 . $ ( "# MyParagraph") css ({ "backgroundColor": "negro", "cor": "branco"}) -

Este exemplo utiliza um objecto JSON definidos como uma série de pares de regra / valor.