JavaScript练习

最新推荐文章于 2024-07-20 23:54:17 发布

Ustinian๑҉

最新推荐文章于 2024-07-20 23:54:17 发布

阅读量94

点赞数 3

文章标签： javascript

本文链接：https://blog.csdn.net/weixin_48506870/article/details/118074781

版权

日历

<script>
window.onload=function ()
{
	var oTab=document.getElementById('tab');
	var aTxt=oTab.getElementsByTagName('div')[0];
	var aLi=oTab.getElementsByTagName('li');
	
	var aArr=[
	'这是一月活动内容',
	'这是二月活动内容',
	'这是三月活动内容',
	'这是四月活动内容',
	'这是五月活动内容',
	'这是六月活动内容',
	'这是七月活动内容',
	'这是八月活动内容',
	'这是九月活动内容',
	'这是十月活动内容',
	'这是十一月活动内容',
	'这是十二月活动内容'
	];
	
	for(var i=0;i<aLi.length;i++)
	{
		aLi[i].index=i;
		aLi[i].onmouseover=function ()
		{
			for(var i=0;i<aLi.length;i++)
			{
				aLi[i].className='';
			}
			this.className='active';
			aTxt.innerHTML='<h2>'+(this.index+1)+'月活动</h2><p>'+aArr[this.index]+'</p>';
		}
	}
}
</script>

在这里插入图片描述

点击弹出对话框

<body>
				<p>点击一下按钮</p>
				<button onclick="myFunction('夏天','夏日入侵企画')">点击这里</button>
				<script>
				function myFunction(myworld,girl){
					alert("欢迎来到" + myworld + ", 这里是" + girl);
				}
				</script>
			</body>

在这里插入图片描述

循环

<script>
window.onload=function ()
{
	var aBtn1=document.getElementById('button1');
	aBtn1.onclick=function ()
	{
		var i=0;
		while(i<5)
		{
			alert('这是第'+(i+1)+'次弹出');
			i++;
		}
	}
	
	var aBtn2=document.getElementById('button2');
	aBtn2.onclick=function ()
	{
		var aSpn3=document.getElementById('div3').getElementsByTagName('span');
		for(var i=0;i<aSpn3.length;i++)
		{
			aSpn3[i].style.background='yellow';
		}
	}
	
	var aBtn3=document.getElementById('button3');
	aBtn3.onclick=function ()
	{
		var aDiv3=document.getElementById('div4').getElementsByTagName('div');
		if(aDiv3[0].style.background=='yellow')
		{
			var i=0;
			while(i<aDiv3.length)
			{
				aDiv3[i].style.background='';
				aDiv3[i].style.height='';
				aDiv3[i].style.width='';
				i=i+1;
			}
		}
		else
		{
			for(var i=0;i<aDiv3.length;i++)
			{
				aDiv3[i].style.background='yellow';
				aDiv3[i].style.height='150px';
				aDiv3[i].style.width='50%';
			}
		}
	}
	
	var aBtn4=document.getElementById('button4');
	var aIpt4=document.getElementById('inputbox').getElementsByTagName('input');
	aBtn4.onclick=function ()
	{
		var i=0;
		while(i<aIpt4.length)
		{
			aIpt4[i].checked=true;
			i=i+1;
		}
	}
	var aBtn5=document.getElementById('button5');
	aBtn5.onclick=function ()
	{
		var i=0;
		while(i<aIpt4.length)
		{
			if(aIpt4[i].checked==true)
			{
				aIpt4[i].checked=false;
			}
			else
			{
				aIpt4[i].checked=true;
			}
			i=i+1;
		}
	}
	var aBtn6=document.getElementById('button6');
	aBtn6.onclick=function ()
	{
		for(var i=0;i<aIpt4.length;i++)
		{
			aIpt4[i].checked=false;
		}
	}
}
</script>

Ustinian๑҉

关注

3
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript练习

日历<script>window.onload=function (){ var oTab=document.getElementById('tab'); var aTxt=oTab.getElementsByTagName('div')[0]; var aLi=oTab.getElementsByTagName('li'); var aArr=[ '这是一月活动内容', '这是二月活动内容', '这是三月活动内容', '这是四月活动内容', '这是五月活动内容',
复制链接

扫一扫