js dom教程

最新推荐文章于 2022-08-08 20:15:33 发布

boowen

最新推荐文章于 2022-08-08 20:15:33 发布

阅读量470

点赞数

分类专栏： PHP

本文链接：https://blog.csdn.net/boowen/article/details/16120319

版权

PHP 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

<!DOC TYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="tet/html;charset=utf-8"/>
</head>
<body>

<p id="intro">Hello World!</p>
<div id="main">
<p> the dom is very useful.</p>
<img id="i" src="goolge.jpg" />
</div>
<p>请输入 5 到 10 之间的数字：</p>
<input id="demo" type="text">
<button type="button" οnclick="myFunction()">测试输入值</button>
<p id="mess"></p>
<p id="p2">php java</p>

<h1 οnclick="this.innerHTML='谢谢！'">请点击文本</h1>
<h2 οnclick="changetext(this)">请点击文本</h2>
<script>
//通过 id 找到 HTML 元素
var x=document.getElementById("intro");
document.write('<p>id="intro" 的段落中的文本是：' + x.innerHTML + '</p>');

var a=document.getElementById("main");
//通过标签名找到 HTML 元素
var s=a.getElementsByTagName("p");
//try 语句允许我们定义在执行时进行错误测试的代码块。
//catch 语句允许我们定义当 try 代码块发生错误时，所执行的代码块。
try{
document.write('id 为“main”的div中的第一文本是：'+s[0].innerHTML);
}catch(err){
alert(err.massage);
}
document.getElementById("i").src="baidu.jpg";//改变了 <img> 元素的 src 属性
function myFunction()
{/*
throw 语句允许我们创建自定义错误。
正确的技术术语是：创建或抛出异常（exception）。
如果把 throw 与 try 和 catch 一起使用，那么您能够控制程序流，并生成自定义的错误消息。
*/
//检测输入变量的值。如果值是错误的，会抛出一个异常（错误）。catch 会捕捉到这个错误，并显示一段自定义的错误消息
try
{
var x=document.getElementById("demo").value;
if(x=="")    throw "值为空";
if(isNaN(x)) throw "不是数字";
if(x>10)     throw "太大";
if(x<5)      throw "太小";
}
catch(err)
{
var y=document.getElementById("mess");
y.innerHTML="错误：" + err + "。";
}
}
//JavaScript 改变 HTML 元素的样式
document.getElementById("p2").style.color="blue";
//请点击文本
function changetext(id){
id.innerHTML="谢谢";
}

</script>

</body>
</html>