<!DOCTYPE html>
<!-- 这是HTML的注释 -->
<html lang="en" id="myHtml">
	<head>
		<!-- 这里不是设置了编码,而是告诉浏览器,用什么编码方式打开文件避免乱码 -->
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>HtmlAll</title>
		<style type="text/css">
			#div1{
				background-color: aquamarine;
				width: 300px;
				height: 300px;
				border: 1px solid black;
				position: relative;
				top: 100px;
				left: 100px;
			}
		</style>
	</head>
	<body>
		<script type="text/javascript" src="j.js"></script>
		<table align="center">
			<form id="myForm">
				<tr><td>登录窗口</td></tr>
				<tr>
					<td>
						<input type="text" id="username"/>
					</td>
				</tr>
				<tr>
					<td>
						<input type="password" id="password"/>
					</td>
				</tr>
				<tr>
					<td>
						<input type="submit" value="登录"/>
					</td>
				</tr>
			</form>
		</table>
		<!-- void运算符的语法是,执行运算符,但不返回任何结果 -->
		<!-- 让我们href的路径消失,用void不返回即可 -->
		<!-- javascript:void(0)我们的javascript是用来提示浏览器的,这是一段JS代码,这是不能省略的 -->
		<a href="javascript:void(0)" onclick="alert('test')">执行页面不跳转</a>
		<input type="button" onclick="vars()" value="123" />
		<input type="button" id="auto" value="auto" />
		<input type="button" id="tyo" value="tyo" />
		<input type="button" value="设置div的内容" id="btnm"/>
		<div id="div1"></div>
	</body>
</html>

<!DOCTYPE html>
<!-- 这是HTML的注释 -->
<html lang="en" id="myHtml">
    <head>
        <!-- 这里不是设置了编码,而是告诉浏览器,用什么编码方式打开文件避免乱码 -->
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>HtmlAll</title>
        <style type="text/css">
            #div1{
                background-color: aquamarine;
                width: 300px;
                height: 300px;
                border: 1px solid black;
                position: relative;
                top: 100px;
                left: 100px;
            }
        </style>
    </head>
    <body>
        <script type="text/javascript" src="j.js"></script>
        <table align="center">
            <form id="myForm">
                <tr><td>登录窗口</td></tr>
                <tr>
                    <td>
                        <input type="text" id="username"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="password" id="password"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        <input type="submit" value="登录"/>
                    </td>
                </tr>
            </form>
        </table>
        <!-- void运算符的语法是,执行运算符,但不返回任何结果 -->
        <!-- 让我们href的路径消失,用void不返回即可 -->
        <!-- javascript:void(0)我们的javascript是用来提示浏览器的,这是一段JS代码,这是不能省略的 -->
        <a href="javascript:void(0)" οnclick="alert('test')">执行页面不跳转</a>
        <input type="button" οnclick="vars()" value="123" />
        <input type="button" id="auto" value="auto" />
        <input type="button" id="tyo" value="tyo" />
        <input type="button" value="设置div的内容" id="btnm"/>
        <div id="div1"></div>
    </body>
</html>

window.onload = function()
{
	document.getElementById("btnm").onclick = function()
	{
		//设置div的内容
		var divElt = document.getElementById("div1");
		//innerHtml和innerText不是代码,是属性,和我们设置text的value原理相同
		//innerHtml会把后面的字符串视为html代码,innerText视为字符串
		divElt.innerHTML = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>";
		divElt.innerText = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>";
	}
	document.getElementById("password").onkeydown = function(event,b)//局部变量
	{
		//获取键值
		//回车键键值是13,ESC是27
		//对于键盘事件来说,他都有keyCode属性用来获取键值
		if(event.keyCode === 13)
		{
			//识别到回车键位提示正在登录
			alert("正在登录")
		}
	}
	
	document.getElementById("myForm").onsubmit = function()
	{
		alert("正在登录")
	}
	
	document.getElementById("auto").onclick = function()
	{
		var ui = [false,true,1,2,"abc",3.14];
		for(var i = 0; i < ui.length; i++)
		{
			alert(ui[i]);
		}
		for(var i in ui)
		{
			//这个var i不是数组的元素,而是数组的下标
			alert(i);//显示都是下标的index
			alert(ui[i]);
		}
	}
	document.getElementById("tyo").onclick = function()
	{
		User = function(username,password)
		{
			this.username = username;
			this.password = password;
		}
		var u = new User("张三","12345");
		alert(u["username"] + "," + u["password"]);
		//这个用在数组上是角标index,用在对象上,是对象的属性名,返回字符串
		for(var value in u)
		{
			//属性名是一个字符串
			alert(value);
			//本身就是一个字符串,直接放进去即可
			alert(u[value]);
		}
		with(u)
		{
			//这种方式仅作了解,不要用尽量,不能所见即所得
			alert(username + "," + password);
		}
	}
}

function vars()
{
	alert("1");
}

window.onload = function()
{
    document.getElementById("btnm").onclick = function()
    {
        //设置div的内容
        var divElt = document.getElementById("div1");
        //innerHtml和innerText不是代码,是属性,和我们设置text的value原理相同
        //innerHtml会把后面的字符串视为html代码,innerText视为字符串
        divElt.innerHTML = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>";
        divElt.innerText = "<font color='red'>哈哈哈哈哈哈哈哈哈</font>";
    }
    document.getElementById("password").onkeydown = function(event,b)//局部变量
    {
        //获取键值
        //回车键键值是13,ESC是27
        //对于键盘事件来说,他都有keyCode属性用来获取键值
        if(event.keyCode === 13)
        {
            //识别到回车键位提示正在登录
            alert("正在登录")
        }
    }
    
    document.getElementById("myForm").onsubmit = function()
    {
        alert("正在登录")
    }
    
    document.getElementById("auto").onclick = function()
    {
        var ui = [false,true,1,2,"abc",3.14];
        for(var i = 0; i < ui.length; i++)
        {
            alert(ui[i]);
        }
        for(var i in ui)
        {
            //这个var i不是数组的元素,而是数组的下标
            alert(i);//显示都是下标的index
            alert(ui[i]);
        }
    }
    document.getElementById("tyo").onclick = function()
    {
        User = function(username,password)
        {
            this.username = username;
            this.password = password;
        }
        var u = new User("张三","12345");
        alert(u["username"] + "," + u["password"]);
        //这个用在数组上是角标index,用在对象上,是对象的属性名,返回字符串
        for(var value in u)
        {
            //属性名是一个字符串
            alert(value);
            //本身就是一个字符串,直接放进去即可
            alert(u[value]);
        }
        with(u)
        {
            //这种方式仅作了解,不要用尽量,不能所见即所得
            alert(username + "," + password);
        }
    }
}

function vars()
{
    alert("1");
}

Logo

有“AI”的1024 = 2048,欢迎大家加入2048 AI社区

更多推荐