ja 基础代码详列

 

上海驾校

js:嵌入在html中,处理数据,其实和as差不多,个人理解是html展示界面,js处理数据

嵌入在html中使用script document.write 用于像页面输出语句
<html>
<head>
<body>
<script type="text/javascript">
document.write("hello world");
</script>
</body>
</head>
</html>


生成普通文件和标签
<html>
<script type="text/javascript">
document.write("<h>hello world</h>");
</script>
<body>
</body>
</html>


也可嵌入在head中
onload 事件会在页面或图像加载完成后立即发生。
<html>
<head>
<script type="text/javascript">
function message(){
alert("该提示框通过onload事件调用的")
}
</script>
<body οnlοad="message()">
</body>
</head>
</html>


定义外部脚本 src= "根目录文件"
<html>
<head>
</head>
<body>
<script src="/ceshi.js">
</script>
<p>
实际是外部的jacascript文件 ceshi.js
</p>
</body>
</html>


完整的javascript语句
<html>
<body>
<script type="text/javascript">
document.write("<h1>hello world</h1>");
document.write("<p>hello world</p>");
</script>
</body>
</html>


javascript 代码块
<script type="text/javascript">
{
document.write("<h1>hello world</h1>");
document.write("<p>hello world</p>");
}
</script>


javascript 代码注释
<html>
<body>
<script type="text/javascript">
//这行是注释
document.write("<h1>hello world</h1>");
/*这行是多行注释
jjjj看看*/
document.write("<p>hello world</p>");
</script>
</body>
</html>


声明一个变量,为其赋值,显示.<br />换行.定义是用var
<html>
<body>
<script type="text/javascript">
var firstName;
firstName = "George";
document.write(firstName);
document.write("<br />");
firstName = "John";
document.write(firstName);
</script>
<p>上面的脚本声明了一个变量,为其赋值,显示该值,改变该值,然后再显示该值。</p>
</body>
</html>


使用if 语句
<html>
<body>
<script type="text/javascript">
var date = new Date();
var time = date.getHours();
if(time < 10){
document.write(time);
document.write("早安");
}
</script>
</body>
</html>


使用if else
<html>
<body>
<script type="text/javascript">
var date = new Date();
var time = date.getHours();
if(time < 10){
document.write(time);
document.write("早安");
}else{
document.write(time);
document.write("午安");
}
</script>
</body>
</html>


If..else if...else 语句
<html>
<body>
<script type="text/javascript">
var date = new Date();
var time = date.getHours();
if(time < 10){
document.write(time);
document.write("早安");
}else if(time >= 10 && time < 16){
document.write(time);
document.write("午安");
}else{
document.write("hahah");
}
</script>
</body>
</html>


链接 其中Math.random 是生成随机数字
<html>
<body>


<script type="text/javascript">
var r = Math.random();
if(r > 0.4){
document.write("<a href = 'http://www.baidu.com'>百度网址</a>");
}else{
document.write("无聊");
}
</script>


</body>
</html>


使用警告框 使用/n达到换行的效果
<html>
<body>


<script type="text/javascript">
function buttonClick(){
alert("button 被点击了 + '\n' + hahah");
}
</script>
<input type="button" value="显示提示框" onClick = "buttonClick()"/>


</body>
</html>


定义确认框 confirm 是 javascript 语言中的一个方法.主要用处是,他可以弹出一个包含"确定"与"取消"的对话方块.用法:confirm(msg)是提示信息
如果用户按下了确定,返回true;或者按下了取消,返回false
<html>
<body>


<script type="text/javascript">
function buttonClick(){
var r = confirm("按钮");
if(r ==true){
alert("你点击了确定");
}else{
alert("你点击了撤销");
}
}
</script>
<input type="button" value="点击弹出确认框" οnclick="buttonClick()">


</body>
</html>


提示框 prompt是 javascript语言中的一个方法,主要用处是:显示提示对话框。
<html>
<head>
<script type="text/javascript">
function buttonClick(){
var name = prompt("请输入你的名字", "dannor");
if(name!=null&&name!=""){
document.write(name);
}
}
</script>
</head>


<body>
<input type="button" οnclick="buttonClick()" value="点击按钮"> 
</body>
</html>


带有参数的函数
<html>
<body>


<script type="text/javascript">
function buttonClick(txt){
document.write(txt);
}
</script>
<input type="button" οnclick="buttonClick('hello')" value="点击按钮"> 

</body>
</html>


带有参数的函数2
<html>
<body>


<script type="text/javascript">
function buttonClick(a){
document.write(a);
}
</script>
<form>
<input type="button" οnclick="buttonClick('hello')" value="hello"> 
<input type="button" οnclick="buttonClick('nice')" value="nice"> 
</form>

</body>
</html>


带有返回数的函数
<html>
<body>


<script type="text/javascript">
function returnNum(){
return ("返回数据");
}
</script>

<script type="text/javascript">
function buttonOnclick(){
document.write(returnNum());
}
</script>

<input type="button" οnclick="buttonOnclick()" value="click">

</body>
</html>


带有参数并返回数的函数
<html>
<body>


<script type="text/javascript">
function returnNum(a, b){
return a*b;
}
</script>

<script type="text/javascript">
function buttonOnclick(){
document.write(returnNum(5, 6));
}
</script>

<input type="button" οnclick="buttonOnclick()" value="click">

</body>
</html>


for循环
<html>
<body>

<script type="text/javascript">
function buttonOnclick(){
for(var i = 0; i<5; i++){
document.write(i+"<br />");
}
}
</script>

<input type="button" οnclick="buttonOnclick()" value="click">

</body>
</html>


while
<html>
<body>

<script type="text/javascript">
function buttonOnclick(){
i = 0;
while(i <= 10){
document.write(i + "<br />");
i++;
}
}
</script>

<input type="button" οnclick="buttonOnclick()" value="click">

</body>
</html>


do.....while
<html>
<body>

<script type="text/javascript">
function buttonOnclick(){
i = 0;
do{
document.write(i + "<br />");
i++;
}while(i < 10)
}
</script>

<input type="button" οnclick="buttonOnclick()" value="click">

</body>
</html>


break
<html>
<body>

<script type="text/javascript">
function buttonOnclick(){
i = 0;
do{
document.write(i + "<br />");
i++;
if(i == 5){
break;
}
}while(i < 10)
}
</script>

<input type="button" οnclick="buttonOnclick()" value="click">

</body>
</html>


continue
<html>
<body>


<script type="text/javascript">
var i=0
for (i=0;i<=10;i++)
{
if (i==3){continue}
document.write("数字是 " + i)
document.write("<br />")
}
</script>


</body>
</html>


for...in
<html>
<body>

<script type="text/javascript">
function buttonOnclick(){
var x;
var myArray = new Array();
myArray[0] = "a";
myArray[1] = "b";
myArray[2] = "c";

for(x in myArray){
document.write(myArray[x]);
document.write("<br />");
}
}
</script>

<input type="button" οnclick="buttonOnclick()" value="click">

</body>
</html>


try....catch
<html>
<head>
<script type="text/javascript">
var txt=""
function message()
{
try{
cscscs("kjdhfdkjh");
}catch(err){
alert(err.description);
}
}
</script>
</head>


<body>
<input type="button" value="查看消息" οnclick="message()" />
</body>


</html>


带有确认框try....catch语句
<html>
<head>
<script type="text/javascript">
function message()
{
try{
cscscs("kjdhfdkjh");
}catch(err){
if(!confirm()){
document.location.href = "http://www.baidu.com";
}
}
}
</script>
</head>


<body>
<input type="button" value="查看消息" οnclick="message()" />
</body>


</html>


throw声明
<html>
<body>
<script type="text/javascript">
var mess = prompt("请输入数字","");
try{
if(mess > 10){
throw "err1"
}else if(mess < 10){
throw "err2"
}
}catch(er){
if(er == "err1"){
alert("err1")
}
if(er == "err2"){
alert("err2")
}
}
</script>
</body>


</html>


onerror 事件
使用 onerror 事件是一种老式的标准的在网页中捕获 Javascript 错误的方法。
(chrome、opera、safari 浏览器不支持)
只要页面中出现脚本错误,就会产生 onerror 事件。
如果需要利用 onerror 事件,就必须创建一个处理错误的函数。你可以把这个函数叫作 onerror 事件处理器 (onerror event handler)。这个事件处理器使用三个参数来调用:msg(错误消息)、url(发生错误的页面的 url)、line(发生错误的代码行)。


<html>
<head>
<script type="text/javascript">
οnerrοr=handleErr
var txt=""


function handleErr(msg,url,l)
{
txt="本页中存在错误。\n\n"
txt+="错误:" + msg + "\n"
txt+="URL: " + url + "\n"
txt+="行:" + l + "\n\n"
txt+="点击“确定”继续。\n\n"
alert(txt)
return true
}


function message()
{
adddlert("Welcome guest!")
}
</script>
</head>


<body>
<input type="button" value="查看消息" οnclick="message()" />
</body>


</html>


检测浏览器及版本
<html>
<head>
<script type="text/javascript">
function message()
{
var browerName = navigator.appName;
var b_version = navigator.appVersion;
document.write(browerName + "<br />");
document.write(b_version);
}
</script>
</head>


<body>
<input type="button" value="查看消息" οnclick="message()" />
</body>


</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值