From c07df985f1466751eff45c881c3ac5460dcbdb22 Mon Sep 17 00:00:00 2001 From: Travis Briggs Date: Mon, 22 Jul 2024 18:57:50 -0700 Subject: [PATCH 1/4] Update article.md Remove non-inclusive language. --- 1-js/01-getting-started/1-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index 2f4f518f3..a58d5d725 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -73,7 +73,7 @@ Examples of such restrictions include: This is called the "Same Origin Policy". To work around that, *both pages* must agree for data exchange and must contain special JavaScript code that handles it. We'll cover that in the tutorial. This limitation is, again, for the user's safety. A page from `http://anysite.com` which a user has opened must not be able to access another browser tab with the URL `http://gmail.com`, for example, and steal information from there. -- JavaScript can easily communicate over the net to the server where the current page came from. But its ability to receive data from other sites/domains is crippled. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation. +- JavaScript can easily communicate over the net to the server where the current page came from. But its ability to receive data from other sites/domains is severely limited. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation. ![](limitations.svg) From 23525fef05538d79202d9af92de03c64739119d0 Mon Sep 17 00:00:00 2001 From: Gabriel Fernandes Date: Mon, 16 Mar 2026 10:10:58 -0300 Subject: [PATCH 2/4] Update 1-js/01-getting-started/1-intro/article.md --- 1-js/01-getting-started/1-intro/article.md | 1 - 1 file changed, 1 deletion(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index b5dd94625..5a640b6b1 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -71,7 +71,6 @@ Exemplos de tais restrições incluem: - Diferentes abas/janelas geralmente não se conhecem mutuamente. Às vezes sim, por exemplo, quando uma janela usa JavaScript para abrir a outra. Mas mesmo neste caso, JavaScript de uma página pode não acessar a outra se eles vierem de sites diferentes (de um domínio, protocolo ou porta diferente). -<<<<<<< HEAD Isto é chamado de "Política de mesma origem". Para contornar isso, *ambas as páginas* devem concordar em trocar dados e conter código JavaScript específico para o fazer. Essa limitação é, novamente, para a segurança do usuário. Uma página de `http://umsitequalquer.com.br` que um usuário abriu não deve poder alcançar uma outra aba do navegador com a URL `http://gmail.com` e roubar a informação de lá. From fa6ac84e24812bb210bfc380af93a5288a83c334 Mon Sep 17 00:00:00 2001 From: Gabriel Fernandes Date: Mon, 16 Mar 2026 10:11:04 -0300 Subject: [PATCH 3/4] Update 1-js/01-getting-started/1-intro/article.md --- 1-js/01-getting-started/1-intro/article.md | 4 ---- 1 file changed, 4 deletions(-) diff --git a/1-js/01-getting-started/1-intro/article.md b/1-js/01-getting-started/1-intro/article.md index 5a640b6b1..0d21d266d 100644 --- a/1-js/01-getting-started/1-intro/article.md +++ b/1-js/01-getting-started/1-intro/article.md @@ -76,10 +76,6 @@ Exemplos de tais restrições incluem: Essa limitação é, novamente, para a segurança do usuário. Uma página de `http://umsitequalquer.com.br` que um usuário abriu não deve poder alcançar uma outra aba do navegador com a URL `http://gmail.com` e roubar a informação de lá. - O JavaScript pode se comunicar facilmente pela rede com o servidor de onde a página atual veio. Mas sua capacidade de receber dados de outros sites / domínios é prejudicada. Embora possível, requer acordo explícito (expresso em cabeçalhos HTTP) do lado remoto. Mais uma vez, isso é uma limitação de segurança. -======= - This limitation is, again, for the user's safety. A page from `http://anysite.com` which a user has opened must not be able to access another browser tab with the URL `http://gmail.com`, for example, and steal information from there. -- JavaScript can easily communicate over the net to the server where the current page came from. But its ability to receive data from other sites/domains is severely limited. Though possible, it requires explicit agreement (expressed in HTTP headers) from the remote side. Once again, that's a safety limitation. ->>>>>>> 52c1e61915bc8970a950a3f59bd845827e49b4bf ![](limitations.svg) From f7922edae4f6be29a50fb99eb47b378d0216e403 Mon Sep 17 00:00:00 2001 From: Bora Lee Date: Sun, 19 Jul 2026 10:41:53 +0900 Subject: [PATCH 4/4] Fix Prism API name: highlightElem -> highlightElement The article's prose and inline examples use Prism.highlightElem, which does not exist in the Prism.js API, while the demo code later in the same article correctly uses Prism.highlightElement. Unify on the real API name. Also pass only the element in forEach callbacks: forEach supplies (element, index, array), which would collide with the highlightElement(element, async, callback) signature if the method reference is passed directly. Co-Authored-By: Claude Fable 5 Claude-Session: https://claude.ai/code/session_01MizgRqMWEBSTYhJ9YhSd2g --- 2-ui/99-ui-misc/01-mutation-observer/article.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/2-ui/99-ui-misc/01-mutation-observer/article.md b/2-ui/99-ui-misc/01-mutation-observer/article.md index 3cf6f5397..ecc89f6e6 100644 --- a/2-ui/99-ui-misc/01-mutation-observer/article.md +++ b/2-ui/99-ui-misc/01-mutation-observer/article.md @@ -128,13 +128,13 @@ Such snippet in an HTML markup looks like this: ... ``` -For better readability and at the same time, to beautify it, we'll be using a JavaScript syntax highlighting library on our site, like [Prism.js](https://prismjs.com/). To get syntax highlighting for above snippet in Prism, `Prism.highlightElem(pre)` is called, which examines the contents of such `pre` elements and adds special tags and styles for colored syntax highlighting into those elements, similar to what you see in examples here, on this page. +For better readability and at the same time, to beautify it, we'll be using a JavaScript syntax highlighting library on our site, like [Prism.js](https://prismjs.com/). To get syntax highlighting for above snippet in Prism, `Prism.highlightElement(pre)` is called, which examines the contents of such `pre` elements and adds special tags and styles for colored syntax highlighting into those elements, similar to what you see in examples here, on this page. -When exactly should we run that highlighting method? Well, we can do it on `DOMContentLoaded` event, or put the script at the bottom of the page. The moment our DOM is ready, we can search for elements `pre[class*="language"]` and call `Prism.highlightElem` on them: +When exactly should we run that highlighting method? Well, we can do it on `DOMContentLoaded` event, or put the script at the bottom of the page. The moment our DOM is ready, we can search for elements `pre[class*="language"]` and call `Prism.highlightElement` on them: ```js // highlight all code snippets on the page -document.querySelectorAll('pre[class*="language"]').forEach(Prism.highlightElem); +document.querySelectorAll('pre[class*="language"]').forEach(elem => Prism.highlightElement(elem)); ``` Everything's simple so far, right? We find code snippets in HTML and highlight them. @@ -146,9 +146,9 @@ let article = /* fetch new content from server */ articleElem.innerHTML = article; ``` -The new `article` HTML may contain code snippets. We need to call `Prism.highlightElem` on them, otherwise they won't get highlighted. +The new `article` HTML may contain code snippets. We need to call `Prism.highlightElement` on them, otherwise they won't get highlighted. -**Where and when to call `Prism.highlightElem` for a dynamically loaded article?** +**Where and when to call `Prism.highlightElement` for a dynamically loaded article?** We could append that call to the code that loads an article, like this: @@ -158,7 +158,7 @@ articleElem.innerHTML = article; *!* let snippets = articleElem.querySelectorAll('pre[class*="language-"]'); -snippets.forEach(Prism.highlightElem); +snippets.forEach(elem => Prism.highlightElement(elem)); */!* ```