HTML JavaScript

• 

  HTML JavaScript

  JavaScript使HTML页面更具动态性和交互性。

  我的第一个JavaScript程序

  点击显示日期和时间

  <h2>我的第一个JavaScript程序</h2>
  
            <button type="button"onclick="document.getElementById('demo').innerHTML = Date()">点击显示日期和时间</button>
            <p id="demo"></p>
  

  尝试一下
• 

  HTML <script>标签

  <script>标签被用于定义客户端脚本（JavaScript）。 <script>元素中包含的脚本语句，或者它指向通过外部脚本文件src的属性。 JavaScript的常见用途是图像处理，表单验证和内容的动态更改。 为了选择HTML元素，JavaScript经常使用 document.getElementById()，document.getElementsByClassName()，document.getElementsByTagName()方法。 这个JavaScript示例写了“欢迎来到菜鸟教程” 到id =“demo”的HTML元素：

  <script>
          document.getElementById("demo").innerHTML = "Hello JavaScript!";
          </script>
          <h1 id="demo"></h1>
  

  尝试一下

  提示：您可以在我们的JavaScript教程中学习更多的JavaScript知识。

• 

  JavaScript使用场景

  • JavaScript可以更改HTML内容
  • JavaScript可以更改HTML样式
  • JavaScript可以更改HTML属性

  <script>
          // JavaScript可以更改HTML内容
          document.getElementById("demo").innerHTML = "欢迎来到菜鸟教程!";
  
          // JavaScript可以更改HTML样式
          document.getElementById("demo").style.fontSize = "25px";
          document.getElementById("demo").style.color = "red";
          document.getElementById("demo").style.backgroundColor = "yellow";
  
          // JavaScript可以更改HTML属性
          document.getElementById("image").src = "images/f1.jpg";
  
          </script>
          <h2 id="demo"></h2>
  

  尝试一下
• 

  HTML<noscript>标签

  <noscript>标记用于为在浏览器中禁用脚本或具有不支持客户端脚本的浏览器的用户提供备用内容。

  <script>
          document.getElementById("demo").innerHTML = "Hello JavaScript!";
          </script>
          <h1 id="demo"></h1>
          <!-- 下面这行 如果禁用了JavaScript，或者不支持JavaScript会显示 -->
          <noscript>对不起你的浏览器禁用了JavaScript，或者不支持JavaScript!</noscript>
  
  

  尝试一下