Análise de problemas de atributos personalizados HTML5

Ao transferir valores entre páginas e js, geralmente usamos data-id=1 e, em seguida, obtemos o valor do id por meio de e.target.dataset.id

Hoje não consigo o valor quando consigo

Posteriormente, descobri que o objeto e possui atributos currentTarget e target, e o conjunto de dados está em currentTarget, portanto, o valor correto é obtido por meio de e.currentTarget.dataset.id .

Além disso, é melhor não usar camel case para nomear data-id=1, como: data-Id=1 , caso contrário, o valor pode não ser obtido às vezes.

É comum ver definições de atributos começando com data- em sites. Embora o W3C não o reconheça, o HTML5 mais recente estipula que data- é razoável, qualquer coisa que comece com data- é um atributo personalizado, que geralmente é usado para implementação. Alguns elementos que não estão claramente definidos em HTML aplicam atributos definidos pelo usuário ao código.

Os eventos são o método de comunicação da camada de visualização para a camada lógica.

Os eventos podem realimentar o comportamento do usuário para a camada lógica para processamento.

Os eventos podem ser vinculados aos componentes. Quando o evento acionador for atingido, a função de processamento de eventos correspondente na camada lógica será executada.

Objetos de evento podem conter informações adicionais, como id, conjunto de dados, toques.

Vincule um manipulador de eventos ao componente.

Por exemplo, bindtap, quando o usuário clica no componente, a função de processamento de eventos correspondente será encontrada na página correspondente da página.

 <view id=tapTest data-hi=WeChat bindtap=tapName> Clique em mim </view>

Escreva a função de processamento de eventos correspondente na definição de página correspondente e o parâmetro é evento.

 Página({ tapName: function(event) { console.log(event) }})

Você pode ver que as informações desconectadas são aproximadamente as seguintes:

 { tipo: tap, timeStamp: 895, alvo: { id: tapTest, conjunto de dados: { hi: WeChat } }, currentTarget: { id: tapTest, conjunto de dados: { hi: WeChat } }, detalhe: { x:53, y: 14 }, toca em:[{ identificador:0, páginaX:53, páginaY:14, clienteX:53, clienteY:14 }], changeTouches:[{identificador:0, páginaX:53, páginaY:14, clienteX:53, clienteY:14 }]}

Responda a eventos usando funções WXS

O texto acima é a análise do problema dos atributos personalizados do HTML5 introduzido pelo editor. Espero que seja útil para você. Se você tiver alguma dúvida, deixe-me uma mensagem e o editor responderá a tempo. Gostaria também de agradecer a todos pelo apoio ao site de artes marciais VeVb!

Se você acha que este artigo é útil para você, fique à vontade para reimprimi-lo, indique a fonte, obrigado!