日度归档:2020年3月1日

HTML DOM scripts 集合简介说明


摘要:
下文讲述html中DOM scripts集合的简介说明,如下所示:


DOM scripts集合功能简介

DOM scripts集合功能简介:
返回当前文档中的script元素的一个“scripts对象数组”集合

DOM scripts返回集合注意事项:
scripts元素在集合中的顺序同文档中的顺序无关

scripts集合属性:
lengths:返回scripts集合中的scripts元素的个数
scripts集合对外方法:
[index]:
返回集合中指定索引的scripts元素(索引从0开始计数)
item(index):返回集合中指定索引的scripts元素(索引从0开始计数)
namedItem(id):
指定scripts集合中指定Id的scripts元素

如果以上信息无法匹配出scripts元素时,则返回null


DOM scripts集合举例说明


 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>猫猫教程(www.maomao365.com)
---dom scripts集合举例说明
</title>
</head>
<body>

<script id="a">
document.write("猫猫教程-欢迎你!");
</script>

<script id="b">
document.write("www.maomao365-欢迎你!");
</script>

<script id="c">
document.write("爱大家!");
</script>

 
<button onclick="funTest1()">scripts集合个数获取</button>

<button onclick="funTest2()">scripts集合第一个元素中text获取</button>


<p id="pTest" style="color:red;font-weight:bold;"> </p>

<script>

function funTest1() {
    var x = document.scripts.length;
    document.getElementById("pTest").innerHTML = "scripts集合中元素个数:"+x;
}

function funTest2() {
    var x = document.scripts[0].text;
    document.getElementById("pTest").innerHTML = x;
}
</script>

</body>
</html>
dom document.scripts集合应用举例说明

dom document.scripts集合应用举例说明

HTML DOM removeEventListener()方法简介说明


摘要:
下文讲述document.removeEventListener()方法的功能简介说明,如下所示:


HTML DOM removeEventListener()方法功能简介

document.removeEventListener()方法功能说明:
删除通过document.addEventListener()方法添加的文档事件

document.removeEventListener方法的语法分享:
document.removeEventListener(event, function, useCapture)
—-参数说明—–

参数名

备注说明
event

必填项,事件名称 click,change 等事件名称–事件名称来源 DOM EVENT对象标
function

必填项,此处可以放入function 也可以放入一个函数名称

useCapture

非必填项,布尔值,需填入 true或false
true:事件捕获阶段时执行
false:事件在冒泡阶段执行


document.removeEventListener()方法 注意事项:
1.removeEventListener方法只可移除有addEventLister添加的非匿名函数
2.添加的匿名函数无法删除


HTML DOM removeEventListener()方法举例说明



<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>猫猫教程(www.maomao365.com)
---removeEventListener方法举例应用
</title>
</head>
<body>

<p>
	当点击文档时,将触发funTest
	当点击下方按钮时,将清除注册事件
</p>

<button onclick="removeEvent()" >清除注册事件</button>
<p id="spanTest"></p>
<script>
if (document.addEventListener) {
    document.addEventListener("click", funTest);
} else if (document.attachEvent) {
    document.attachEvent("click", funTest);
}
function funTest() {
    document.getElementById("spanTest").innerHTML = "您点击了当前文档:"+Math.random();
}
function removeEvent() {
    if (document.removeEventListener) {
        document.removeEventListener("click", funTest);
    } else if (document.detachEvent) {
        document.detachEvent("click", funTest);
    }
}
</script>

</body>
</html>
 dom document.removeListener方法举例说明

dom document.removeListener方法举例说明

HTML DOM referrer属性简介说明


摘要:
下文讲述DOM referrer属性的相关说明,如下所示:


DOM referrer属性简介说明

DOM referrer属性的功能:
返回载入当前文档的源URL

DOM referrer属性注意事项:
此属性为只读属性


DOM referrer属性举例说明


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>猫猫教程(www.maomao365.com)
  ---document.referrer
</title>
</head>
<body>
文档的来源地(document.referrer):
<script>
document.write(document.referrer);
</script>
</body>
</html>