roy-tian / learning-area Goto Github PK

View Code? Open in Web Editor NEW

816.0 16.0 1.4K 82.82 MB

MDN 学习区示例中文版

License: Creative Commons Zero v1.0 Universal

HTML 63.23% JavaScript 27.56% CSS 9.16% PHP 0.02% Python 0.03%

learning-area's People

Stargazers

Watchers

Forkers

arily5990 yoloqin alonewolf666 2686469571 ji2294961523 m1114378154 andoped liunian594 lgdisgod1 zattic 872495688 suky607 q815438609 a171417 liujincom wangsr2 ling863676769 lddz 2558525764 18176962906 muller25-13 projeck-cd 84430286 mdzzshita wemore00 fffish9 bluenanana xiangchengem scutalouise mac617 xyuwan virtualrealitychen sappanwood fenfenraorao mmchao opp1opp1 neverthe tqdksx mikuhao yinggege takumar50 moshuxiong the-dark-knight6 dayongll lsjh bluepikachu wangyongjie2017 liaowenke yayure micah-yu pskdpsk mluckydream karrol earthtimo courgexie minxiang0101 vickyrong yufuchen lukeeeeeeeeee arrwun rench1988 mtdk sunsetpark50 vizy-cc qwas3110 justingeeky returntotheyouth loneyiserror laughingtao jun86616396 cbhust8025 qq3636212 funnywus kaivon rainism1 sstshenshutao zhangchao999 yuhan0927 corpseboys wangths orangefatcat levin-site 956553821 redsnowc xingyuelongchen lzx411559669 k1yle zszzzhy helpayment caizekai1998 kevin-1212 soupor sgxin 409235338 plalk aerolie geoyclv neakari wyx2014 sdwsaw

learning-area's Issues

js 代码重复

在笑话机的main.js文件中，第 24 与第 35 行代码相同，是 Shift + Alt + ↓ 按秃噜了吗😂

mdn-examples/html/site-structure/index.html页面52、54行乱码了

refactor code

function result() {
let isCN = document.getElementById("cn").checked;
let newStory = isCN ? storyTextZh : storyText;
let insert0 = isCN ? insertA : insertX;
let insert1 = isCN ? insertB : insertY;
let insert2 = isCN ? insertC : insertZ;

let replace0 = isCN ? ':inserta:' : ':insertx:';
let replace1 = isCN ? ':insertb:' : ':inserty:';
let replace2 = isCN ? ':insertc:' : ':insertz:';
let placeName = isCN ? '李雷' : 'Bob';

newStory = newStory.replace(replace0, randomValueFromArray(insert0));
newStory = newStory.replace(replace0, randomValueFromArray(insert0));
newStory = newStory.replace(replace1, randomValueFromArray(insert1));
newStory = newStory.replace(replace2, randomValueFromArray(insert2));

if(customName.value !== '') {
    var name = customName.value;
    newStory = newStory.replace(placeName, name);
}

if(document.getElementById("uk").checked) {
    const weight = Math.round(300 * 0.0714286) + ' stone';
    const temperature = Math.round((94 - 32) * 5 / 9) + ' centigrade';
    newStory = newStory.replace('94 fahrenheit', temperature);
    newStory = newStory.replace('300 pounds', weight);
}

story.textContent = newStory;
story.style.visibility = 'visible';
}

“查找并解决 JavaScript 代码的错误”章节下链接失效

https://wiki.developer.mozilla.org/zh-CN/docs/Learn/JavaScript/First_steps/What_went_wrong
该章节下“一个出错的示例”部分中的在线运行超链接失效了。

在线运行失效的链接是：
https://roy-tian.github.io/mdn-examples/javascript/number-guessing-game/number-game-errors.html

function result() {
let isCN = document.getElementById("cn").checked;
let newStory = isCN ? storyTextZh : storyText;
let insert0 = isCN ? insertA : insertX;
let insert1 = isCN ? insertB : insertY;
let insert2 = isCN ? insertC : insertZ;

let replace0 = isCN ? ':inserta:' : ':insertx:';
let replace1 = isCN ? ':insertb:' : ':inserty:';
let replace2 = isCN ? ':insertc:' : ':insertz:';
let placeName = isCN ? '李雷' : 'Bob';

newStory = newStory.replace(replace0, randomValueFromArray(insert0));
newStory = newStory.replace(replace0, randomValueFromArray(insert0));
newStory = newStory.replace(replace1, randomValueFromArray(insert1));
newStory = newStory.replace(replace2, randomValueFromArray(insert2));

if(customName.value !== '') {
    var name = customName.value;
    newStory = newStory.replace(placeName, name);
}

if(document.getElementById("uk").checked) {
    const weight = Math.round(300 * 0.0714286) + ' stone';
    const temperature = Math.round((94 - 32) * 5 / 9) + ' centigrade';
    newStory = newStory.replace('94 fahrenheit', temperature);
    newStory = newStory.replace('300 pounds', weight);
}

story.textContent = newStory;
story.style.visibility = 'visible';

}

404 error

when I click a "raw" button, the firfox can't copy it properly. It jumps to error pages.

color picker tool 需要更新

由于MDN代码变动，原mdn.mozillademos.org域已不负责存储图片，故出现了这些404请求代码。颜色选择器例子中的图片资源需要重新引用，特此记录此issue。

mdn-examples/html/planets-data/start.zip里，txt文档中的column被翻译成行了

辛苦了

meta-example.html has problem

I follow the steps

and add <script> and <style>
I can not get same result like that.

So I checked. the console gives this error

I found some pages that said <script> should be after the body.

I tried it works.

In the meta-example.html there has "defer". It means after HTML body loaded , load this.
<script src="script.js" defer></script>

My point is this, learn page does not include what is defer means.

could you add this defer information on MDN learn page? (https://developer.mozilla.org/zh-CN/docs/learn/HTML/Introduction_to_HTML/The_head_metadata_in_HTML)

async的用法是不是有问题？

很多章节的js文件中都是进行操作DOM，又没有DOMContentLoaded的，而在HTML中它们几乎都是用的<script async>这种形式的标签。

<head>
    <script src="script.js" async></script>
</head>

但查其他资料却都是说 async 异步加载完立刻执行，最好不要用于上面那种操作DOM的情况：Script Tag - async & defer

而 MDN 的入门文档却说这样用是对的，比如什么是 JavaScript？里介绍如何避免在解析HTML文档之前调用javascript的部分：
【在上文的“内部”、“外部”示例中，JavaScript 调用于文档头处，解析 HTML 文档体之前。这样做是有隐患的，需要使用一些结构来避免错误发生。】
【“内部”示例使用了以下结构：这是一个事件监听器，它监听浏览器的 "DOMContentLoaded" 事件，即 HTML 文档体加载、解释完毕事件。事件触发时将调用 " . . ." 处的代码，从而避免了错误发生（事件的概念稍后学习）。】
【“外部”示例中使用了 JavaScript 的一项现代技术（async “异步”属性）来解决这一问题，它告知浏览器在遇到 <script> 元素时不要中断后续 HTML 内容的加载。注：“外部”示例中 async 属性可以解决调用顺序问题，因此无需使用 DOMContentLoaded 事件。而 async 只能用于外部脚本，因此不适用于“内部”示例。】

再比如笑话生成器的示例代码。

roy-tian / learning-area Goto Github PK

learning-area's People

Stargazers

Watchers

Forkers

learning-area's Issues

js 代码重复

mdn-examples/html/site-structure/index.html页面52、54行乱码了

CSS部分没有更新啊

refactor code

“查找并解决 JavaScript 代码的错误”章节下链接失效

refactor

404 error

color picker tool 需要更新

mdn-examples/html/planets-data/start.zip里，txt文档中的column被翻译成行了

meta-example.html has problem

async的用法是不是有问题？

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent