diff --git a/src/content/0/en/part0b.md b/src/content/0/en/part0b.md index de0953dd23..b3f9d009d8 100644 --- a/src/content/0/en/part0b.md +++ b/src/content/0/en/part0b.md @@ -440,7 +440,7 @@ The Form Data dropdown is within the new Payload tab, located to the right of th ![form data dropdown in developer tools](../../images/0/23e.png) -The Form tag has attributes action and method, which define that submitting the form is done as an HTTP POST request to the address new_note. +The Form tag has attributes action and method, which define that submitting the form is done as an HTTP POST request to the address new\_note. ![action and method highlight](../../images/0/24e.png) @@ -549,7 +549,7 @@ form.onsubmit = function(e) { } ``` -The command document.getElementById('notes_form') instructs the code to fetch a reference to the HTML form element on the page that has the ID "notes_form" and to register an event handler to handle the form's submit event. The event handler immediately calls the method e.preventDefault() to prevent the default handling of form's submit. The default method would send the data to the server and cause a new GET request, which we don't want to happen. +The command document.getElementById('notes\_form') instructs the code to fetch a reference to the HTML form element on the page that has the ID "notes\_form" and to register an event handler to handle the form's submit event. The event handler immediately calls the method e.preventDefault() to prevent the default handling of form's submit. The default method would send the data to the server and cause a new GET request, which we don't want to happen. Then the event handler creates a new note, adds it to the notes list with the command notes.push(note), rerenders the note list on the page and sends the new note to the server. diff --git a/src/content/0/es/part0b.md b/src/content/0/es/part0b.md index fd06a81697..27c10a0bf1 100644 --- a/src/content/0/es/part0b.md +++ b/src/content/0/es/part0b.md @@ -550,7 +550,7 @@ form.onsubmit = function(e) { } ``` -El comando document.getElementById('notes_form') le indica al código que obtenga el elemento form de la página y que registre un event handler para manejar el evento de envío del formulario. El controlador de eventos llama inmediatamente al método e.preventDefault() para evitar el manejo por defecto del envío de formularios. El método por defecto enviaría los datos al servidor y causaría una nueva solicitud GET, lo cual no queremos que suceda. +El comando document.getElementById('notes\_form') le indica al código que obtenga el elemento form de la página y que registre un event handler para manejar el evento de envío del formulario. El controlador de eventos llama inmediatamente al método e.preventDefault() para evitar el manejo por defecto del envío de formularios. El método por defecto enviaría los datos al servidor y causaría una nueva solicitud GET, lo cual no queremos que suceda. Luego el controlador de eventos crea una nueva nota, la agrega a la lista de notas con el comando notes.push(note), vuelve a renderizar la lista de notas en la página y envía la nueva nota al servidor. diff --git a/src/content/0/fi/osa0b.md b/src/content/0/fi/osa0b.md index a9a9327619..0204902a62 100644 --- a/src/content/0/fi/osa0b.md +++ b/src/content/0/fi/osa0b.md @@ -435,7 +435,7 @@ Network-välilehti näyttää myös lomakkeen mukana lähetetyn datan: ![](../../images/0/23e.png) -Lomakkeen lähettäminen tapahtuu HTTP POST ‑pyyntönä ja osoitteeseen new_note form-tagiin määriteltyjen attribuuttien action ja method ansiosta: +Lomakkeen lähettäminen tapahtuu HTTP POST ‑pyyntönä ja osoitteeseen new\_note form-tagiin määriteltyjen attribuuttien action ja method ansiosta: ![](../../images/0/24e.png) @@ -542,7 +542,7 @@ form.onsubmit = function(e) { } ``` -Komennolla document.getElementById('notes_form') koodi hakee sivulta lomake-elementin ja rekisteröi sille tapahtumankäsittelijän hoitamaan tilanteen, jossa lomake "submitoidaan" eli lähetetään. Tapahtumankäsittelijä kutsuu heti metodia e.preventDefault(), jolla se estää lomakkeen lähetyksen oletusarvoisen toiminnan. Oletusarvoinen toiminta aiheuttaisi lomakkeen lähettämisen ja sivun uudelleen lataamisen, joita emme single page ‑sovelluksissa halua tapahtuvan. +Komennolla document.getElementById('notes\_form') koodi hakee sivulta lomake-elementin ja rekisteröi sille tapahtumankäsittelijän hoitamaan tilanteen, jossa lomake "submitoidaan" eli lähetetään. Tapahtumankäsittelijä kutsuu heti metodia e.preventDefault(), jolla se estää lomakkeen lähetyksen oletusarvoisen toiminnan. Oletusarvoinen toiminta aiheuttaisi lomakkeen lähettämisen ja sivun uudelleen lataamisen, joita emme single page ‑sovelluksissa halua tapahtuvan. Tämän jälkeen koodi luo muistiinpanon, lisää sen muistiinpanojen listalle komennolla notes.push(note), piirtää ruudun sisällön eli muistiinpanojen listan uudelleen ja lähettää uuden muistiinpanon palvelimelle. diff --git a/src/content/0/fr/part0b.md b/src/content/0/fr/part0b.md index 802f3957e5..8663b3b247 100644 --- a/src/content/0/fr/part0b.md +++ b/src/content/0/fr/part0b.md @@ -433,7 +433,7 @@ NB: Dans les dernières versions de Chrome, les informations sur les données de ![informations sur les données de formulaire](../../images/0/23e.png) -La balise Form a les attributs action et method, qui définissent que la soumission du formulaire se fait sous la forme d'une requête HTTP POST à ​​l'adresse new_note. +La balise Form a les attributs action et method, qui définissent que la soumission du formulaire se fait sous la forme d'une requête HTTP POST à ​​l'adresse new\_note. ![mise en évidence de l'action et la méthode du formulaire](../../images/0/24e.png) diff --git a/src/content/0/ptbr/part0b.md b/src/content/0/ptbr/part0b.md index c3aa640792..2f75b32229 100644 --- a/src/content/0/ptbr/part0b.md +++ b/src/content/0/ptbr/part0b.md @@ -441,7 +441,7 @@ Obs.: Na versão mais recente do Chrome, o menu drop-down (lista suspensa) "Form ![Menu drop-down do Form Data das Ferramentas do Desenvolvedor](../../images/0/23e.png) -A tag Form tem os atributos action e method, que definem que o envio do formulário é feito como uma requisição HTTP POST para o endereço new_note. +A tag Form tem os atributos action e method, que definem que o envio do formulário é feito como uma requisição HTTP POST para o endereço new\_note. ![Destaque dos atributos action e method](../../images/0/24e.png) @@ -547,7 +547,7 @@ form.onsubmit = function(e) { } ``` -O comando document.getElementById('notes_form') instrui o código a buscar o elemento de formulário da página e a registrar um gerenciador de evento para lidar com o evento de envio do formulário. O gerenciador de evento chama imediatamente o método e.preventDefault() para evitar o tratamento padrão do envio do formulário. O método padrão enviaria os dados para o servidor e causaria uma nova requisição GET, o que não queremos que aconteça. +O comando document.getElementById('notes\_form') instrui o código a buscar o elemento de formulário da página e a registrar um gerenciador de evento para lidar com o evento de envio do formulário. O gerenciador de evento chama imediatamente o método e.preventDefault() para evitar o tratamento padrão do envio do formulário. O método padrão enviaria os dados para o servidor e causaria uma nova requisição GET, o que não queremos que aconteça. Em seguida, o gerenciador de evento cria uma nova nota, adiciona-a à lista de notas com o comando notes.push(note), redesenha a lista de notas na página e envia a nova nota ao servidor. @@ -567,7 +567,7 @@ var sendToServer = function(note) { O código determina que os dados devem ser enviados com uma requisição HTTP POST e o tipo de dados deve ser JSON. O tipo de dados é determinado com um cabeçalho Content-type. Em seguida, os dados são enviados como uma string JSON. O código da aplicação está disponível em . -Vale ressaltar que a aplicação serve apenas para demonstrar os conceitos do curso. O código segue um estilo ruim de desenvolvimento em algumas partes e não deve ser usado como exemplo ao criar suas próprias aplicações. O mesmo se aplica às URLs usadas. A URL new_note_spa para a qual as novas notas são enviadas, não segue as melhores práticas usadas atualmente. +Vale ressaltar que a aplicação serve apenas para demonstrar os conceitos do curso. O código segue um estilo ruim de desenvolvimento em algumas partes e não deve ser usado como exemplo ao criar suas próprias aplicações. O mesmo se aplica às URLs usadas. A URL new\_note\_spa para a qual as novas notas são enviadas, não segue as melhores práticas usadas atualmente. ### Bibliotecas JavaScript diff --git a/src/content/0/zh/part0b.md b/src/content/0/zh/part0b.md index fd4ad9b764..83c055b6cb 100644 --- a/src/content/0/zh/part0b.md +++ b/src/content/0/zh/part0b.md @@ -524,7 +524,7 @@ list.appendChild(newElement) ![Detail view of the first request](../../images/0/22e.png) -这是一个[HTTP POST](https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/POST)请求,指向服务器地址new_note。服务器回应的是HTTP状态代码302。这是一个[URL重定向](https://en.wikipedia.org/wiki/URL_redirection),服务器要求浏览器对头信息Location中定义的地址--即地址notes做一个新的HTTP GET请求。 +这是一个[HTTP POST](https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/POST)请求,指向服务器地址new\_note。服务器回应的是HTTP状态代码302。这是一个[URL重定向](https://en.wikipedia.org/wiki/URL_redirection),服务器要求浏览器对头信息Location中定义的地址--即地址notes做一个新的HTTP GET请求。 于是,浏览器重新加载了笔记页面。重载又引起了三个HTTP请求:获取样式表(main.css)、JavaScript代码(main.js)和笔记的原始数据(data.json)。 @@ -538,7 +538,7 @@ list.appendChild(newElement) ![](../../images/0/23e.png) - 表单标签有属性actionmethod,它们定义了提交表单是以HTTP POST请求的方式完成的,地址为new_note。 + 表单标签有属性actionmethod,它们定义了提交表单是以HTTP POST请求的方式完成的,地址为new\_note。 ![](../../images/0/24e.png) @@ -635,7 +635,7 @@ HTML代码几乎相同,但JavaScript文件不同(spa.js),而且 ![](../../images/0/26e.png) - 发送到地址new_note/spa的POST请求包含了新笔记的JSON数据,包含了笔记的内容(content)和时间戳(date)。 + 发送到地址new\_note\_spa的POST请求包含了新笔记的JSON数据,包含了笔记的内容(content)和时间戳(date)。 ```js { @@ -705,7 +705,7 @@ var sendToServer = function(note) { 应用代码可在中找到。 - 值得记住的是,这个应用只是为了演示课程的概念。代码在某种程度上遵循了不良的开发风格,在创建你自己的应用时,不应作为一个例子来使用。所用的URL也是如此。发送新笔记的URL new_note\_spa并不符合当前的最佳实践。 + 值得记住的是,这个应用只是为了演示课程的概念。代码在某种程度上遵循了不良的开发风格,在创建你自己的应用时,不应作为一个例子来使用。所用的URL也是如此。发送新笔记的URL new\_note\_spa并不符合当前的最佳实践。 ### JavaScript-libraries