HTML5_焦点管理

最新推荐文章于 2023-04-06 19:42:22 发布

荆莿鸟的绝唱

最新推荐文章于 2023-04-06 19:42:22 发布

阅读量1.4k

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/only_Love_Strangers/article/details/47114061

版权

js 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

<html>
	<head>
		<title>HTML5_焦点管理</title>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<script type="text/javascript">
			window.onload = function(){
				/*
				HTML5添加了辅佐管理DOM焦点的功能。首先就是document.activeElement属性，这个属性
				始终会引用DOM中当前获得的了焦点的元素。元素获得焦点的方式有页面加载、用户输入（通常
				通过Tab键）和代码中调用focus()方法。来看几个例子。
				*/
				var button = document.getElementById("myButton");
				button.focus();//获取焦点
				alert(document.activeElement == button);//true
				
				/*
				默认情况下文档加载完成是，document.activeElement会保存document.body元素的引用。
				文档加载期间会document.activeElement的值为null。
				另外就是新增了document.hasFocus()方法，用于检测文档是否获得焦点。
				*/
				var isFocus = document.hasFocus();
				alert(isFocus);//true
				/*
				通过检测文档是否获得焦点，可知道用户是否在和页面交互。
				查询文档获知哪个元素获得了焦点，以及确定文档是否获得焦点，这两个功能最重要的提高
				web的无障碍性。无障碍web应用的一个主要标志就是恰当的焦点管理，而确、切的知道哪个元素
				获得了焦点是一个极大的进步，至少我们不要向过去一样来猜测了。
				实现了这两个属性的浏览器包括IE4+、fireFox 3+、Safari4+、Chrome 和Opera 8+。
				*/
			}
		</script>
	</head>
	<body>
		<button id="myButton">
			button
		</button>
	</body>
</html>

荆莿鸟的绝唱

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5_焦点管理

HTML5_焦点管理 window.onload = function(){ /* HTML5添加了辅佐管理DOM焦点的功能。首先就是document.activeElement属性，这个属性始终会引用DOM中当前获得的了焦点的元素。元素获得焦点的方式有页面加载、用户输入（通常通过Tab键）和代码中调用focus()方法。来看几个例子。
复制链接

扫一扫