zoukankan      html  css  js  c++  java
  • Head first javascript(一)

    网页需要更好的交互体验,仅仅有html和css当然不够,因此javascript粉末登场

    <script>表示当前页面有javascript,一般放在<head>中

    <html>
        <head>
            <title>...</title>
            <script type = "text/javascript">
                function ...
            </script>
        </head>
        ...
    </html>
    

    onload : 页面加载完成之后会出发onload event

    alert() : 插入一些提示信息

    example:

    <body onload = "alert('Hello, world');">
    

    在页面加载完成之后提示'Hello, world',可以发现调用函数的方式是触发时机onload加上函数alert


    以下代码自己定义了一个函数touchRock(),onclick表示在鼠标点击图片的时候触发:

    <head>
    ...
    <script type="text/javascript">
    		function touchRock() {
    			var username = prompt("what is your name?", "enter your name here.")
    			if(username){
    				alert("it is good to meet your, " + username )
    				document.getElementById("rocking").src = "/home/jolin/Desktop/JS examples/chapter01/irock/rock_happy.png"
    			}
    		}
    	</script>
    </head>
    <body onload="alert('hello, i am your pet rock.');">
    	<div style="margin-top: 100px; text-align: center">
    		<img id="rocking" alt="iRock"
    			src="/home/jolin/Desktop/JS examples/chapter01/irock/rock.png"
    			style="cursor: pointer" 
    			onclick="touchRock();" />
    	</div>
    </body>
    
  • 相关阅读:
    程序是怎样跑起来的 第三章
    C#4.5-4.7学习总结
    第二周学习总结
    程序是如何跑起来的 第二章
    第一章读后感
    师生关系读后感
    C#学习总结
    我与计算机
    读《程序怎样跑起来》第一章有感
    读师生关系有感
  • 原文地址:https://www.cnblogs.com/jolin123/p/3917005.html
Copyright © 2011-2022 走看看