外联css及js的使用

时间:2021-11-22 07:01:28

结构图如下:

外联css及js的使用

html如下:

<!DOCTYPE html>
<html>
<head>
<title>button test</title>
<link rel="stylesheet" type="text/css" href="css/1.css">
</head>
<body>
<script src="js/udf.js"></script> <input class="btn1" type="button" value="click" onclick="func1()"> <input id="txt1" class="txt1" type="text" value=""> </body>
</html>

css如下:

.btn1{
font-size: 24px;
width: 100px;
height: 60px;
}
.txt1{
font-size: 48px;
width: 100px;
}

js如下:

function func1()
{
var sum=0;
var string1 = document.getElementById("txt1");
for(var i =1;i<=10;i++)
{
sum += i;
//document.write(sum+"<br\>") ;
}
string1.value = sum;
}