JavaScript入门——JS交互语句和语句格式点要

最新推荐文章于 2021-10-11 15:44:22 发布

PisecesPeng

最新推荐文章于 2021-10-11 15:44:22 发布

阅读量574

点赞数 1

分类专栏： JavaScript 文章标签： javascript 交互语句语句格式基础

本文链接：https://blog.csdn.net/peng_666666/article/details/54707147

版权

JavaScript 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

基本格式已省略，直接列出代码部分

1.js基本交互示例

<!-- <script>中可省略type="text/javascript" -->
<body>

  <p>
    <strong>javascript</strong>
  </p>

  <!-- 在html输出javascript -->
  <script  type="text/javascript">
    document.write("<h1>this is a heading</h1>")
    document.write("<p>this is a footing</p>")
  </script>

  <!-- 对html事件做出反应 -->
  <button type="button" onclick="alert('welcome!')">click</button>

  <!-- 改变html内容 -->
  <p id="demo1">old</p>
  <script type="text/javascript">
    function myFun1()
    {
      x=document.getElementById("demo1");  //找到元素
      x.innerHTML="new";  //改变元素
    }
  </script>
  <button type="button" onclick="myFun1()">click</button>

  <br />
  <!-- 改变html图像 -->
  <script type="text/javascript">
  function changeImage()
  {
    element=document.getElementById('myimage')
    if (element.src.match("比较图片名"))
    {
      element.src="图片完整位置";
    }
    else
    {
      element.src="图片完整位置";
    }
  }
  </script>
  <img id="myimage" onclick="changeImage()" src="图片完整位置">

  <!-- 改变html样式 -->
  <p id="demo2">javascript</p>
  <script type="text/javascript">
    function myFun2()
    {
      x=document.getElementById("demo2")  //找到元素
      x.style.color="#ff0000";  //改变样式
    }
  </script>
  <button type="button" onclick="myFun2()">click</button>

  <!-- 验证输入 -->
  <p>please input number!</p>
  <input id="demo3" type="text">
  <script type="text/javascript">
    function myFun3()
    {
      var x=document.getElementById("demo3").value;
      <!-- 是否是数字 -->
      if (x=="" || isNaN(x))  
      {
        alert("not numeric");
      }
    }
  </script>
  <button type="button" onclick="myFun3()">click</button>

</body>

2.语句格式点要

<body>
    <!--
    js语句通过{}代码块进行组合，
    块的作用是使语句序列一起执行
    -->

    <!--
    js对大小写敏感，这个要注意
    -->

    <!--
    js会忽略多余的空格，所以可以适当添加空格，提高可读性
    -->

    <!--
    在文本字符串中使用反斜杠对代码进行换行
    例：
    document.write("hello \
    world!")

    错误示例：
    document.write \
    ("hello world!")

    -->

  </body>

PisecesPeng

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JavaScript入门——JS交互语句和语句格式点要

基本格式已省略，直接列出代码部分1.js基本交互示例<body> <p> <strong>javascript</strong> </p>  <script type="text/javascript"> document.wri
复制链接

扫一扫

专栏目录