JS表单对象和图片对象--JavaScript基础

时间:2022-11-15 19:15:54

1、表单对象

1)访问者输入正确的密码才可进入网站

HTML DOM prompt() 方法,prompt() 方法用于显示可提示用户进行输入的对话框。prompt(text,defaultText),text:可选,要在对话框中显示的纯文本(而不是 HTML 格式的文本)。defaultText:可选,默认的输入文本。

<script>
  var passward = prompt("请输入密码(本站需要密码才可以进入):","");
  if(passward != 'niuxinlong'){
    alert("密码不正确,无法进入本站!");
    window.close();
   }else {
    window.open("http://www.cnblogs.com/qikeyishu/");
  }
</script>

2、图片对象

1)获取图片信息

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>获取图片信息</title>
</head>
<body>
<div id="img">
<img name="Img" border="2" width="100" height="100" lowsrc="img.jpg" src="imgs/lanrenzhijia.jpg" hspace="6" vspace="6" alt="image.jpg">
</div>
<script>
getInfo();
function getInfo() {
  document.write("边框:");
  document.write(document.Img.border);
  document.write("<br>");
  document.write("加载是否完成:");
  document.write(document.Img.complete);
  document.write("<br>");
  document.write("图片的宽度:");
  document.write(document.Img.width);
  document.write("<br>");
  document.write("图片的高度:");
  document.write(document.Img.height);
  document.write("<br>");
  document.write("lowsrc的url为:");
  document.write(document.Img.lowsrc);//lowsrc属性用来设置在显示图片前,所显示的低分辨率图片的url
  document.write("<br>");
  document.write("图片的url:");
  document.write(document.Img.src);
  document.write("<br>");  
  document.write("图片的水平边距hspace:");//设置与文件的横向间隔
  document.write(document.Img.hspace);
  document.write("<br>");
  document.write("图像的垂直边距vspace:");//设置与文件的纵向间隔
  document.write(document.Img.vspace);
}
</script>
</body>
</html>

效果图

JS表单对象和图片对象--JavaScript基础

2)显示加载图像状态