jQuery Mobile - Perguntas da entrevista

O que é jQuery Mobile?

É uma estrutura de interface de usuário que é construída no núcleo do jQuery e usada para desenvolver sites ou aplicativos responsivos que são acessíveis em dispositivos móveis, tablets e desktops.

Por que usar o jQuery Mobile?

Ele cria aplicativos da web de forma que funcionem da mesma forma em dispositivos móveis, tablets e desktops.
É compatível com outros frameworks como PhoneGap, Whitelight etc.
Ele fornece um conjunto de entradas de formulário amigáveis ao toque e widgets de interface do usuário.
Ele traz funcionalidades para todas as plataformas de celulares, tablets e desktops e adiciona carregamentos de página eficientes e suporte mais amplo a dispositivos.

Liste alguns recursos do jQuery Mobile?

Ele é construído no jQuery Core e estrutura de UI "escreva menos, faça mais".
É um código aberto, plataforma cruzada e compatível com vários navegadores.
É escrito em JavaScript e usa recursos de jQuery e jQueryUI para construir sites amigáveis móveis.
Ele integra HTML5, CCS3, jQuery e jQueryUI em uma estrutura para a criação de páginas com o mínimo de script.
Inclui um sistema de navegação Ajax que usa transições de página animadas.

Quais são as vantagens do jQuery Mobile?

É fácil aprender e desenvolver aplicativos se você tiver conhecimento dos recursos HTML5 e CSS3.
Ele é compatível com várias plataformas e navegadores, então você não precisa se preocupar em escrever códigos diferentes para cada resolução de dispositivo.
Ele usa HTML5 junto com JavaScript para facilitar o desenvolvimento de aplicativos da web.
Ele é construído de forma a permitir que o mesmo código seja dimensionado automaticamente da tela do celular para a tela do desktop.

Quais são as desvantagens do jQuery Mobile?

Existem opções limitadas para temas CSS, de forma que os sites podem ser semelhantes aos criados por esses temas.
Os aplicativos desenvolvidos com jQuery Mobile são mais lentos em celulares.
Torna-se mais demorado quando você combina o jQuery mobile com outras estruturas móveis.
É difícil fornecer um design visual personalizado completo.

Quais são as duas opções para baixar a biblioteca jQuery Mobile?

Custom Download : Para baixar uma versão personalizada da biblioteca.
Latest Stable: Para obter a versão estável e mais recente da biblioteca jQuery Mobile.

Nomeie os arquivos CDN que são usados com jQuery Mobile?

Você pode usar os seguintes arquivos CDN -

<link rel = "stylesheet" href = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src = "https://code.jquery.com/jquery-1.11.3.min.js"> </script>
<script src = "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"> </script>

Qual é a estrutura básica da página do jQuery Mobile?

<div data-role = "page" id = "pageone">
    <div data-role = "header">
      <h1>Header</h1>
    </div>

    <div data-role = "main" class = "ui-content">
      //content goes here
    </div>

    <div data-role = "footer">
      <h1>Footer</h1>
    </div>
</div>

O que é o atributo data-role = "header"?

Ele cria o cabeçalho no topo da página.

O que é o atributo data-role = "main"?

É usado para definir o conteúdo da página.

O que é o atributo data-role = "footer"?

Ele cria rodapé na parte inferior da página.

O que é o atributo data-role = "ui-content"?

Inclui preenchimento e margem dentro do conteúdo da página.

Como incluir várias páginas em um único documento móvel jQuery?

Múltiplas páginas podem ser incluídas em um único documento móvel jQuery que carregam juntos adicionando vários divs com atributo data-role = "page"

Como exibir uma caixa de diálogo na página?

Use o atributo data-dialog = "true" para qualquer página para exibir um diálogo.

Como usar efeitos de transição na página?

O atributo de transição de dados é usado para aplicar as diferentes transições na caixa de diálogo, como deslizar, virar etc.

Como fechar o botão na página?

O botão pode ser fechado usando o atributo data-close-btn.

Qual atributo é usado para voltar ao diálogo anterior?

O atributo data-rel = "back" é usado para navegar e voltar ao diálogo anterior.

Como aplicar o tema para diálogos, cabeçalho, rodapé ou conteúdo?

O tema pode ser incluído na caixa de diálogo adicionando tema de dados de atributo a quaisquer contêineres, como cabeçalho, rodapé ou conteúdo.

Qual classe é usada para fazer cantos arredondados?

ui-corner-all

Como definir o ícone e a posição do ícone no botão?

Você pode definir o ícone no botão usando a classe ui-icon e a classe ui-btn-icon-pos_name para especificar a posição do ícone.

Como definir a sombra do ícone em seu botão?

Você pode adicionar a sombra do ícone em seu botão usando a classe ui-shadow-icon.

Como remover o círculo cinza ao redor do ícone?

Você pode remover o círculo cinza ao redor do ícone usando a classe ui-nodisc-icon.

Como criar uma grade de coluna única?

Use a classe ui-grid-solo na tag div para criar uma grade de coluna única.

Como criar uma grade de duas colunas e um layout de duas colunas?

Adicione a classe ui-grid-a à tag div e inclua dois contêineres filho com as classes ui-block-a e ui-block-b para criar o layout de duas colunas.

Como criar uma grade de três colunas?

Use a classe ui-grid-b na tag div para criar uma grade de três colunas.

Como criar uma grade de quatro colunas?

Use a classe ui-grid-c na tag div para criar uma grade de quatro colunas.

Como criar uma grade de cinco colunas?

Use a classe ui-grid-d na tag div para criar uma grade de cinco colunas.

Como criar botão na página?

Crie um botão básico simples na página usando a classe ui-btn.

Como criar grupo de botões na página?

Crie um grupo de botões vertical e horizontalmente na página usando o atributo data-role = "controlgroup".

Como criar o mini botão e a posição do ícone na página?

Você pode criar um botão menor na página usando a classe ui-mini e exibir a posição dos ícones no botão usando a classe ui-btn-icon-ico_pos.

Como exibir o selecionador de data na página?

Use o atributo data-role = "date" no campo de entrada para exibir no formato dd / mm / aa.

Como criar um widget recolhível?

O recolhível pode ser criado usando o atributo data-role = "collapsible" para um contêiner.

Como criar um widget de grupo de controle?

Você pode exibir o grupo de controle usando o atributo data-role = "controlgroup".

Como filtrar os filhos de qualquer elemento?

Usando o atributo data-filter = "true", você pode filtrar os filhos de qualquer elemento.

Qual é o uso do widget flip switch?

Flip Switch permite que você ligue / desligue ou true / false o switch clicando nele para entrada de estilo booleano.

O que é listview?

O Listview é usado para exibir uma lista de itens. O atributo data-role = "listview" é incluído no contêiner para exibir a lista na lista rolável vertical.

O que é rangelider?

O widget Rangeslider oferece um par de alças que permitem selecionar um intervalo de valor numérico.

O que são eventos para celular?

Um evento responderá à interação do usuário quando o usuário clicar em determinada página ou passar o mouse sobre um elemento, etc.

O que é um evento touch tap?

Ele é disparado quando o usuário toca em um elemento usando o id da página para especificar o evento e o método on () anexa os manipuladores de eventos.

O que é um evento de toque de deslizar?

Ele é disparado quando o usuário arrasta horizontalmente mais de 30 px sobre um elemento usando o id da página para especificar o evento e o método on () anexa os manipuladores de eventos.

O que são eventos de início e parada de rolagem?

O evento de início de rolagem é disparado quando o usuário começa a rolar a página e o evento de parada de rolagem é disparado quando o usuário para de rolar a página usando o id da página para especificar o evento e o método on () anexa os manipuladores de eventos.

O que é evento de orientação?

Você pode acionar o evento de orientação quando o usuário gira o dispositivo vertical ou horizontalmente usando o evento de mudança de orientação . Ele usa a propriedade window.orientation para especificar se a janela ou dispositivo está definido com orientação vertical ou horizontal.

O que é a dica do controle deslizante?

Você pode exibir o valor do controle deslizante como uma dica de ferramenta usando o atributo data-popup-enabled = "true".

O que é alternância de coluna?

A alternância de coluna coloca as colunas em um local oculto e permite que o usuário selecione colunas conforme sua escolha usando o atributo data-mode = "columntoggle".

O que é refluxo de tabela?

Ele representa os dados em formato horizontal, recolhendo a tabela em uma representação empilhada usando o atributo data-mode = "reflow".

Como exibir os dados da tabela em formato de listras e traços?

Você pode exibir os conjuntos de dados em formato de faixas e traços usando as classes table-stripe e table-stroke.

O que é aprimorado com entrada de texto?

Você pode aumentar a qualidade e a funcionalidade das entradas de texto definindo o atributo data-Enhanced = "true" no campo de entrada.

Como mudar a cor do ícone?

Você pode alterar a cor do ícone para preto usando a classe ui-alt-icon. Por padrão, todos os ícones são brancos.

Quem desenvolveu o framework jQuery Mobile?

Foi desenvolvido pela equipe do projeto jQuery no ano de 2010 e escrito em JavaScript.

O que é o atributo data-ajax?

Indica se as páginas devem ser carregadas por meio de ajax ou não.