7da04a348b
<!-- Please follow this checklist and put an x in each of the boxes, like this: [x]. It will ensure that our team takes your pull request seriously. --> - [x] I have read [freeCodeCamp's contribution guidelines](https://github.com/freeCodeCamp/freeCodeCamp/blob/master/CONTRIBUTING.md). - [x] My pull request has a descriptive title (not a vague title like `Update index.md`) - [x] My pull request targets the `master` branch of freeCodeCamp.
43 lines
881 B
Markdown
43 lines
881 B
Markdown
---
|
|
title: Onclick Event Attribute
|
|
localeTitle: Onclick atributo de evento
|
|
---
|
|
## Onclick atributo de evento
|
|
|
|
Cuando se hace clic en el elemento se dispara un evento.
|
|
|
|
Funciona igual que el _método onclick_ o `addEventListener('click')` al elemento.
|
|
|
|
```html
|
|
|
|
<element onclick="event"></element>
|
|
```
|
|
|
|
> `event` puede ser una función de JavaScript o puede escribir JavaScript en bruto
|
|
|
|
### Ejemplos
|
|
|
|
Cambiar el color de un elemento `<p>` al hacer clic
|
|
|
|
```html
|
|
|
|
<p id="text" onclick="redify()">Change my color</p>
|
|
|
|
<script>
|
|
function redify(){
|
|
let text = document.querySelector('#text');
|
|
text.style.color = "red";
|
|
}
|
|
</script>
|
|
```
|
|
|
|
Usando el atributo onclick en bruto de JavaScript:
|
|
|
|
```html
|
|
|
|
<button onclick="alert('Hello')">Hello World</button>
|
|
```
|
|
|
|
#### Más información:
|
|
|
|
* [MDN](https://developer.mozilla.org/pt-BR/docs/Web/API/GlobalEventHandlers/onclick) |