Introduction à JavaScript
JavaScript est le langage de script le plus populaire sur Internet. Ce langage peut être utilisé pour le HTML et le Web, et peut être largement utilisé dans les serveurs, les PC et les ordinateurs portables. , et les tablettes et les appareils tels que les smartphones.
JavaScript est un langage de script
JavaScript est un langage de programmation léger.
JavaScript est du code de programmation qui peut être inséré dans des pages HTML.
JavaScript, lorsqu'il est inséré dans une page HTML, peut être exécuté par tous les navigateurs modernes.
JavaScript est facile à apprendre.
Ce que vous apprendrez
Voici les principales choses que vous apprendrez dans ce tutoriel.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<p>
JavaScript 能够直接写入 HTML 输出流中：
</p>
<script>
document.write("<h1>This is a title</h1>");
document.write("<p>This is a paragraph</p>");
</script>
<p>
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>
</body>
</html>Rappel : vous ne pouvez utiliser document.write que dans la sortie HTML. Si vous utilisez cette méthode après le chargement du document, l'intégralité du document sera écrasée.
JavaScript : Réaction aux événements :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>JavaScript</h1>
<p>
JavaScript 能够对事件作出反应。比如对按钮的点击：
</p>
<button type="button" onclick="alert('欢迎!')">点我!</button>
</body>
</html>Rappel chaleureux : La fonction alert() n'est pas couramment utilisée en JavaScript, mais elle est utile pour les tests de code, c'est très pratique. L'événement
onclick n'est qu'un des nombreux événements que vous découvrirez dans ce didacticiel.
JavaScript : Modifier le contenu HTML
L'utilisation de JavaScript pour traiter le contenu HTML est une fonctionnalité très puissante.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>JavaScript</h1>
<p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p>
<script>
function myFunction()
{
x=document.getElementById("demo"); // 找到元素
x.innerHTML="Hello JavaScript!"; // 改变内容
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>Vous verrez souvent document.getElementById("some id"). Cette méthode est définie dans le DOM HTML.
DOM (Document Object Model) est le standard officiel du W3C pour accéder aux éléments HTML.
Vous découvrirez le DOM HTML dans plusieurs chapitres de ce tutoriel.
JavaScript : Modifier le style HTML
Modifier le style des éléments HTML, qui est une variante de la modification des attributs HTML.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>JavaScript</h1>
<p id="demo">
JavaScript 能改变 HTML 元素的样式。
</p>
<script>
function myFunction()
{
x=document.getElementById("demo") // 找到元素
x.style.color="#ff0000"; // 改变样式
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>JavaScript : validation de la saisie
JavaScript est souvent utilisé pour valider la saisie de l'utilisateur.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>我的第一段 JavaScript</h1>
<p>请输入数字。如果输入值不是数字，浏览器会弹出提示框。</p>
<input id="demo" type="text">
<script>
function myFunction()
{
var x=document.getElementById("demo").value;
if(x==""||isNaN(x))
{
alert("不是数字");
}
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
</body>
</html>
section suivante