JavaScript 简介

Posted wskxy

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript 简介相关的知识,希望对你有一定的参考价值。

1.onclick事件

<button type="button" onclick="alert(‘Welcome!‘)">点击这里</button>

<div onclick="alert(‘Welcome!‘)">点击这个div</div>

2.改变 html 内容

   添加按钮,并调用onclick事件

<p id="demo">                           
javascript 能改变 HTML 元素的内容。
</p>

<script>
function myFunction()
{
x=document.getElementById("demo");  // 找到元素
x.innerHTML="Hello JavaScript!";    // 改变内容
}
</script>

<button type="button" onclick="myFunction()">点击这里</button>//设置事件触发按钮

3.图片替换

<script>
function changeImage()
{
element=document.getElementById(‘myimage‘)
if (element.src.match("图片1链接"))
  {
  element.src="图片2链接";
  }
else
  {
  element.src="图片1链接";
  }
}
</script>

<img id="myimage" onclick="changeImage()" src="图片1链接">

4.改变标签的css

 <body>
  <p id="demo" style="color: black;">JavaScript 能改变 HTML 元素的样式。</p>  <!--需要改变样式的标签-->
        <script>//设置改变方法
         function myf()
         {
             x=document.getElementById("demo");
             if(x.style.color.match(‘black‘))
             {
                x.style.color="red";
             }
             else if(x.style.color.match(‘red‘))
             {
             x.style.color="blue"; 
             }
                else
                {
             x.style.color="black"; 
                }
         }
        </script>
        <input type="button" onclick="myf()" value="点击这里" /> <!--点击方法-->
 </body>

5.判断输入是否是数字

<body>
  <input id="demo" type="text" />
        <script>//设置改变方法
         function myf()
         {
             x=document.getElementById("demo").value;
             if(x==""||isNaN(x))       //isNaN()代表非数字
             {
              alert("输入错误");
             }
         }
        </script>
        <input type="button" onclick="myf()" value="点击这里" /> <!--点击方法-->
 </body>

<——第一节完——>
























































以上是关于JavaScript 简介的主要内容,如果未能解决你的问题,请参考以下文章

HTML-教案-JavaScript简介

01-Javascript简介(了解)

JavaScript入门第一章(JavaScript简介)

javascript构成简介

JavaScript简介

JavaScript入门经典的内容简介