JavaScript1

最新推荐文章于 2024-04-28 11:43:36 发布

qingemengyue

最新推荐文章于 2024-04-28 11:43:36 发布

阅读量274

点赞数

分类专栏： HTML javascript 文章标签： javascript html

本文链接：https://blog.csdn.net/qingemengyue/article/details/74941405

版权

HTML 同时被 2 个专栏收录

26 篇文章 0 订阅

订阅专栏

javascript

17 篇文章 2 订阅

订阅专栏

一些需要注意的：

1.变量必须以字母开头（可以以$和_开头但不推荐）；
2.大小写敏感；
3.数据类型：动态
这里写图片描述
数字+字符串=字符串
JavaScript 中的所有数字都存储为根为 10 的 64 位（8 比特），浮点数

4.变量生存期
　　开始：从声明开始
　　结束：局部变量：函数运行后被删除
　　　　　全局变量：页面关闭后被删除
5.==等于
　===全等于（值和类型）
6.break
　　　用于循环和switch中
　break labelname

cars=["BMW","Volvo","Saab","Ford"];
list:
{
   document.write(cars[0] + "<br>");
   document.write(cars[1] + "<br>");
   document.write(cars[2] + "<br>");
   break list;
   document.write(cars[3] + "<br>");
   document.write(cars[4] + "<br>");
   document.write(cars[5] + "<br>");
}

7.document.getElementById(“id”);

8.表单验证(输入是否合法)

<html>
<head>
<script type="text/javascript">

function validate_required(field,alerttxt)
{
with (field)
  {
  if (value==null||value=="")
    {alert(alerttxt);return false}  //必填项
  else {return true}
  }
}

function validate_form(thisform)
{
with (thisform)
  {
  if (validate_required(email,"Email must be filled out!")==false)
    {email.focus();return false}
  }
}
</script>
</head>

<body>
<form action="submitpage.htm" onsubmit="return validate_form(this)" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit"> 
</form>
</body>

</html>

<html>
<head>
<script type="text/javascript">
function validate_email(field,alerttxt)
{
with (field)
{//e-mail输入是否合乎基本语法
apos=value.indexOf("@")
dotpos=value.lastIndexOf(".")
if (apos<1||dotpos-apos<2) 
  {alert(alerttxt);return false}
else {return true}
}
}

function validate_form(thisform)
{
with (thisform)
{
if (validate_email(email,"Not a valid e-mail address!")==false)
  {email.focus();return false}
}
}
</script>
</head>

<body>
<form action="submitpage.htm"onsubmit="return validate_form(this);" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit"> 
</form>
</body>

</html>

JavaScript HTML DOM

1.改变 HTML
　　document.write()：不要使用在文档加载之后，会覆盖该文档
　　document.getElementById(id).innerHTML=new HTML：使用 innerHTML 属性
　　document.getElementById(id).attribute=new value：例子（document.getElementById(“image”).src=”landscape.jpg”;）

2.DOM 事件

<h1 onclick="changetext(this)">请点击该文本</h1>
<body onload="checkCookies()"> //onload 和onunload 事件会在用户进入或离开页面时被触发;onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本;onload 和 onunload 事件可用于处理 cookie。
<input type="text" id="fname" onchange="upperCase()">//常结合对输入字段input的验证
<div onmouseover="mOver(this)" onmouseout="mOut(this)">把鼠标移到上面</div>
<div onmousedown="mDown(this)" onmouseup="mUp(this)">请点击这里</div>//按下鼠标，抬起鼠标

3.DOM 元素（节点）

//--------------------------------------------------
//创建新的 HTML 元素
<!DOCTYPE html>
<html>
<body>

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>

<script>
var para=document.createElement("p");   //新建DOM元素
var node=document.createTextNode("这是新段落。");//向<p>元素添加文本必须首先创建文本节点
para.appendChild(node);//必须向<p>元素追加这个文本节点

var element=document.getElementById("div1");
element.appendChild(para); //向一个已存在的元素追加该元素
</script>

</body>
</html>

//------------------------------------------------
//删除已有的 HTML 元素
<!DOCTYPE html>
<html>
<body>

<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>

<script>
var para=document.createElement("p");//DOM 需要清楚您需要删除的元素，以及它的父元素
var node=document.createTextNode("这是新段落。");
para.appendChild(node);
//var child=document.getElementById("p1");   第二种方式
//child.parentNode.removeChild(child);

var element=document.getElementById("div1");
element.appendChild(para);
</script>

</body>
</html>

qingemengyue

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript1

一些需要注意的：1.变量必须以字母开头（可以以$和_开头但不推荐）； 2.大小写敏感； 3.数据类型：动态数字+字符串=字符串4.变量生存期　　开始：从声明开始　　结束：局部变量：函数运行后被删除　　　　　全局变量：页面关闭后被删除 5.==等于　===全等于（值和类型） 6.break 　　　用于循环和switch中　break labelnamecar
复制链接

扫一扫

专栏目录