googlechrome
/
devtools-samples
зеркало из https://github.com/GoogleChrome/devtools-samples.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

add getting started demo for debugging js

This commit is contained in:
Kayce Basques 2016-11-17 16:53:15 -08:00
Родитель e8f79d69ec
Коммит f08ac78593
3 изменённых файлов: 95 добавлений и 0 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

36
debug-js/get-started-1.js Normal file
Просмотреть файл

@ -0,0 +1,36 @@
/* Copyright 2016 Google Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License. */
function onClick() {
if (inputsAreEmpty()) {
label.textContent = 'Error: one or both inputs are empty.';
return;
}
updateLabel();
}
function updateLabel() {
var addend1 = getNumber1();
var addend2 = getNumber2();
var sum = addend1 + addend2;
label.textContent = addend1 + ' + ' + addend2 + ' = ' + sum;
}
function getNumber1() {
return inputs[0].value;
}
function getNumber2() {
return inputs[1].value;
}
var inputs = document.querySelectorAll('input');
var label = document.querySelector('p');
var button = document.querySelector('button');
button.addEventListener('click', onClick);

20
debug-js/get-started-2.js Normal file
Просмотреть файл

@ -0,0 +1,20 @@
/* Copyright 2016 Google Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License. */
function inputsAreEmpty() {
if (getNumber1() === '' || getNumber2() === '') {
return true;
} else {
return false;
}
}

39
debug-js/get-started.html Normal file
Просмотреть файл

@ -0,0 +1,39 @@
<!--
Copyright 2016 Google Inc.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<!doctype html>
<html>
<head>
<title>Demo: Get Started Debugging JavaScript with Chrome DevTools</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
input, button {
width: 50%;
height: 25%;
border: 1px solid grey;
margin: 1%;
}
</style>
</head>
<body>
<h1>Demo: Get Started Debugging JavaScript with Chrome DevTools</h1>
<input placeholder="Number 1">
<input placeholder="Number 2">
<button>Add Number 1 and Number 2</button>
<p></p>
<script src="get-started-1.js"></script>
<script src="get-started-2.js"></script>
</body>
</html>