Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

zh-cn: Format /web/api using Prettier (part 8) #14682

Merged
merged 3 commits into from
Jul 29, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 18 additions & 19 deletions files/zh-cn/web/api/nodelist/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,10 +14,10 @@ slug: Web/API/NodeList
在一些情况下,`NodeList` 是一个实时集合,也就是说,如果文档中的节点树发生变化,`NodeList` 也会随之变化。例如,{{domxref("Node.childNodes")}} 是实时的:

```js
var parent = document.getElementById('parent');
var parent = document.getElementById("parent");
var child_nodes = parent.childNodes;
console.log(child_nodes.length); // 我们假设结果会是“2”
parent.appendChild(document.createElement('div'));
parent.appendChild(document.createElement("div"));
console.log(child_nodes.length); // 但此时的输出是“3”
```

Expand Down Expand Up @@ -49,7 +49,7 @@ console.log(child_nodes.length); // 但此时的输出是“3”

```js
for (var i = 0; i < myNodeList.length; ++i) {
var item = myNodeList[i]; // 调用 myNodeList.item(i) 是没有必要的
var item = myNodeList[i]; // 调用 myNodeList.item(i) 是没有必要的
}
```

Expand All @@ -58,7 +58,7 @@ for (var i = 0; i < myNodeList.length; ++i) {
[for...of](/zh-CN/JavaScript/Reference/Statements/for...of) 循环**将会**正确的遍历 `NodeList` 对象:

```js
var list = document.querySelectorAll('input[type=checkbox]');
var list = document.querySelectorAll("input[type=checkbox]");
for (var checkbox of list) {
checkbox.checked = true;
}
Expand All @@ -69,7 +69,7 @@ for (var checkbox of list) {
也有一种使用数组 `Array` 的 {{jsxref("Array.forEach()", "Array.prototype.forEach")}} 来遍历 `NodeList` 的方法,这种方法兼容 Internet Explorer {{Deprecated_Inline}}:

```js
var list = document.querySelectorAll('input[type=checkbox]');
var list = document.querySelectorAll("input[type=checkbox]");
Array.prototype.forEach.call(list, function (checkbox) {
checkbox.checked = true;
});
Expand Down Expand Up @@ -100,22 +100,21 @@ NodeList 的原型上除了类似数组的 `forEach` 方法之外,还有 `item
一个解决办法就是把 `Array.prototype` 上的方法添加到 `NodeList.prototype` 上。可是,要注意[扩展 DOM 对象的原型是非常危险的](http://perfectionkills.com/whats-wrong-with-extending-the-dom/),尤其是在旧版本的 Internet Explorer(6,7,8)中。

```js
var arrayMethods = Object.getOwnPropertyNames( Array.prototype );
var arrayMethods = Object.getOwnPropertyNames(Array.prototype);

arrayMethods.forEach( attachArrayMethodsToNodeList );
arrayMethods.forEach(attachArrayMethodsToNodeList);

function attachArrayMethodsToNodeList(methodName)
{
if(methodName !== "length") {
function attachArrayMethodsToNodeList(methodName) {
if (methodName !== "length") {
NodeList.prototype[methodName] = Array.prototype[methodName];
}
};
}

var divs = document.getElementsByTagName( 'div' );
var firstDiv = divs[ 0 ];
var divs = document.getElementsByTagName("div");
var firstDiv = divs[0];

firstDiv.childNodes.forEach(function( divChild ){
divChild.parentNode.style.color = '#0F0';
firstDiv.childNodes.forEach(function (divChild) {
divChild.parentNode.style.color = "#0F0";
});
```

Expand All @@ -124,11 +123,11 @@ firstDiv.childNodes.forEach(function( divChild ){
```js
var forEach = Array.prototype.forEach;

var divs = document.getElementsByTagName( 'div' );
var firstDiv = divs[ 0 ];
var divs = document.getElementsByTagName("div");
var firstDiv = divs[0];

forEach.call(firstDiv.childNodes, function( divChild ){
divChild.parentNode.style.color = '#0F0';
forEach.call(firstDiv.childNodes, function (divChild) {
divChild.parentNode.style.color = "#0F0";
});
```

Expand Down
4 changes: 2 additions & 2 deletions files/zh-cn/web/api/nodelist/keys/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,8 @@ node.appendChild(kid3);
var list = node.childNodes;

// Using for..of
for(var key of list.keys()) {
console.log(key);
for (var key of list.keys()) {
console.log(key);
}
```

Expand Down
2 changes: 1 addition & 1 deletion files/zh-cn/web/api/nodelist/length/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ slug: Web/API/NodeList/length
## 语法

```js
numItems =nodeList.length
numItems = nodeList.length;
```

- `numItems` 是一个整数,表示 `NodeList` 子节点的数量。
Expand Down
2 changes: 1 addition & 1 deletion files/zh-cn/web/api/nodelist/values/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ node.appendChild(kid3);
var list = node.childNodes;

// Using for..of
for(var value of list.values()) {
for (var value of list.values()) {
console.log(value);
}
```
Expand Down
11 changes: 5 additions & 6 deletions files/zh-cn/web/api/notification/notification/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -47,13 +47,12 @@ let myNotification = new Notification(title, options);
In our [Emogotchi demo](http://mdn.github.io/emogotchi/) ([see source code](https://github.com/mdn/emogotchi)), we run a simple `spawnNotification()` function when we want to fire a notification — this is passed arguments to specify the body, icon and title we want, then it creates the necessary `options` object and fires the notification using the `Notification()` constructor.

```js
function spawnNotification(theBody,theIcon,theTitle) {
function spawnNotification(theBody, theIcon, theTitle) {
var options = {
body: theBody,
icon: theIcon
}
var n = new Notification(theTitle,options);

body: theBody,
icon: theIcon,
};
var n = new Notification(theTitle, options);
}
```

Expand Down
28 changes: 15 additions & 13 deletions files/zh-cn/web/api/notificationevent/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,23 +33,25 @@ _从其父项**{{domxref("ExtendableEvent")}}**继承方法_。
## 例

```js
self.addEventListener('notificationclick', function(event) {
console.log('On notification click: ', event.notification.tag);
self.addEventListener("notificationclick", function (event) {
console.log("On notification click: ", event.notification.tag);
event.notification.close();

// This looks to see if the current is already open and
// focuses if it is
event.waitUntil(clients.matchAll({
type: "window"
}).then(function(clientList) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
if (client.url == '/' && 'focus' in client)
return client.focus();
}
if (clients.openWindow)
return clients.openWindow('/');
}));
event.waitUntil(
clients
.matchAll({
type: "window",
})
.then(function (clientList) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
if (client.url == "/" && "focus" in client) return client.focus();
}
if (clients.openWindow) return clients.openWindow("/");
}),
);
});
```

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,9 +22,9 @@ Web Notifications API 使页面可以发出通知,通知将被显示在页面
要显示一条通知,你需要先请求适当的权限,然后你可以实例化一个 {{domxref("Notification")}} 实例:

```js
Notification.requestPermission( function(status) {
Notification.requestPermission(function (status) {
console.log(status); // 仅当值为 "granted" 时显示通知
var n = new Notification("title", {body: "notification body"}); // 显示通知
var n = new Notification("title", { body: "notification body" }); // 显示通知
});
```

Expand Down Expand Up @@ -52,7 +52,7 @@ Notification.requestPermission( function(status) {
通常你应在你的应用首次初始化的时候请求显示通知的权限:

```js
window.addEventListener('load', function () {
window.addEventListener("load", function () {
Notification.requestPermission(function (status) {
// 这将使我们能在 Chrome/Safari 中使用 Notification.permission
if (Notification.permission !== status) {
Expand Down Expand Up @@ -103,7 +103,7 @@ window.addEventListener('load', function () {
> var n = new Notification("Hi!");
> n.onshow = function () {
> setTimeout(n.close.bind(n), 5000);
> }
> };
> ```
>
> 当你接收到一个“close”事件时,并不能保证这个通知是被用户关闭的。这是符合规范的,其中指出:“当一个通知被关闭时,通知的关闭动作都必须执行,不论是底层通知平台导致,还是用户导致。”
Expand All @@ -119,7 +119,7 @@ window.addEventListener('load', function () {
它可能通过这样的方式处理通知:

```js
window.addEventListener('load', function () {
window.addEventListener("load", function () {
// 首先,让我们检查我们是否有权限发出通知
// 如果没有,我们就请求获得权限
if (window.Notification && Notification.permission !== "granted") {
Expand All @@ -130,9 +130,9 @@ window.addEventListener('load', function () {
});
}

var button = document.getElementsByTagName('button')[0];
var button = document.getElementsByTagName("button")[0];

button.addEventListener('click', function () {
button.addEventListener("click", function () {
// 如果用户同意就创建一个通知
if (window.Notification && Notification.permission === "granted") {
var n = new Notification("Hi!");
Expand Down Expand Up @@ -189,7 +189,7 @@ window.addEventListener('load', function () {
它有可能通过这种方式处理的多个通知:

```js
window.addEventListener('load', function () {
window.addEventListener("load", function () {
// 首先,我们检查是否具有权限显示通知
// 如果没有,我们就申请权限
if (window.Notification && Notification.permission !== "granted") {
Expand All @@ -200,14 +200,14 @@ window.addEventListener('load', function () {
});
}

var button = document.getElementsByTagName('button')[0];
var button = document.getElementsByTagName("button")[0];

button.addEventListener('click', function () {
button.addEventListener("click", function () {
// 如果用户同意接收通知,我们就尝试发送 10 条通知
if (window.Notification && Notification.permission === "granted") {
for (var i = 0; i < 10; i++) {
// 感谢标记,我们应该只看到内容为 "Hi! 9" 的通知
var n = new Notification("Hi! " + i, {tag: 'soManyNotification'});
var n = new Notification("Hi! " + i, { tag: "soManyNotification" });
}
}

Expand All @@ -224,7 +224,7 @@ window.addEventListener('load', function () {
if (status === "granted") {
for (var i = 0; i < 10; i++) {
// Thanks to the tag, we should only see the "Hi! 9" notification
var n = new Notification("Hi! " + i, {tag: 'soManyNotification'});
var n = new Notification("Hi! " + i, { tag: "soManyNotification" });
}
}

Expand Down
2 changes: 1 addition & 1 deletion files/zh-cn/web/api/oes_vertex_array_object/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ WebGL extensions are available using the {{domxref("WebGLRenderingContext.getExt
## Examples

```js
var oes_vao_ext = gl.getExtension('OES_vertex_array_object');
var oes_vao_ext = gl.getExtension("OES_vertex_array_object");
var vao = oes_vao_ext.createVertexArrayOES();
oes_vao_ext.bindVertexArrayOES(vao);

Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: 'OfflineAudioContext: complete event'
title: "OfflineAudioContext: complete event"
slug: Web/API/OfflineAudioContext/complete_event
---

Expand Down Expand Up @@ -37,21 +37,21 @@ slug: Web/API/OfflineAudioContext/complete_event
处理完成后,您可能希望使用`oncomplete`处理程序提示用户现在可以播放音频,并启用播放按钮:

```js
offlineAudioCtx.addEventListener('complete',()=> {
console.log('Offline audio processing now complete');
showModalDialog('Song processed and ready to play');
offlineAudioCtx.addEventListener("complete", () => {
console.log("Offline audio processing now complete");
showModalDialog("Song processed and ready to play");
playBtn.disabled = false;
})
});
```

You can also set up the event handler using the {{domxref("OfflineAudioContext.oncomplete")}} property:

```js
offlineAudioCtx.oncomplete = function() {
console.log('Offline audio processing now complete');
showModalDialog('Song processed and ready to play');
offlineAudioCtx.oncomplete = function () {
console.log("Offline audio processing now complete");
showModalDialog("Song processed and ready to play");
playBtn.disabled = false;
}
};
```

## Specifications
Expand Down
44 changes: 24 additions & 20 deletions files/zh-cn/web/api/offlineaudiocontext/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ _从父级 {{domxref("AudioContext")}} 和 {{domxref("EventTarget")}} 获取方
// 定义一个在线或者离线的音频上下文

var audioCtx = new AudioContext();
var offlineCtx = new OfflineAudioContext(2,44100*40,44100);
var offlineCtx = new OfflineAudioContext(2, 44100 * 40, 44100);

source = offlineCtx.createBufferSource();

Expand All @@ -60,36 +60,40 @@ source = offlineCtx.createBufferSource();
function getData() {
request = new XMLHttpRequest();

request.open('GET', 'viper.ogg', true);
request.open("GET", "viper.ogg", true);

request.responseType = 'arraybuffer';
request.responseType = "arraybuffer";

request.onload = function() {
request.onload = function () {
var audioData = request.response;

audioCtx.decodeAudioData(audioData, function(buffer) {
audioCtx.decodeAudioData(audioData, function (buffer) {
myBuffer = buffer;
source.buffer = myBuffer;
source.connect(offlineCtx.destination);
source.start();
//source.loop = true;
offlineCtx.startRendering().then(function(renderedBuffer) {
console.log('渲染完全成功');
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var song = audioCtx.createBufferSource();
song.buffer = renderedBuffer;

song.connect(audioCtx.destination);

play.onclick = function() {
song.start();
}
}).catch(function(err) {
console.log('渲染失败:' + err);
offlineCtx
.startRendering()
.then(function (renderedBuffer) {
console.log("渲染完全成功");
var audioCtx = new (window.AudioContext ||
window.webkitAudioContext)();
var song = audioCtx.createBufferSource();
song.buffer = renderedBuffer;

song.connect(audioCtx.destination);

play.onclick = function () {
song.start();
};
})
.catch(function (err) {
console.log("渲染失败:" + err);
// 注意:当 OfflineAudioContext 上 startRendering 被立刻调用,Promise 应该被 reject
});
});
});
}
};

request.send();
}
Expand Down
Loading