利用innerHTML实现隐显效果-两种实现方法

最近对JavaScript非常感兴趣，可能因为是它和JAVA差不多吧。原来看到一些网页上的隐显效果，心理面真是佩服，心想自己能够做就爽了。现在对innerHTML有一点的了解，做这个东西就相对简单了，下面就是我自己弄来玩的一个例子，我相信你看了过后，如果你原来也没有做过，那我保证你说“原来这么简单！！！”：

这里要补充说明一点，就是不同的浏览器对Javascript的支持不同，我这里用了FireFox和微软的浏览器比较了一下，有些能够在微软的浏览器实现效果下，在FireFox下不一能够实现。

<html>
<head>
<title>
</title>
<script>
//这种方式是通过显示条件判定来决定innerHTML的显示内容
//这里显示的内容是原来不存在的。这个方法只支持微软的浏览器
function tClick(id)
{
var str='';
if(id==1)
{
  str='<a href=# οnclick=t(2)><--</a>';
  str+='<br>      ';
  str+='1、你好';
  str+='<br>      ';
  str+='2、欢迎光临';
}
else
{
  str='<a href=# οnclick=t(1)>--></a>';
}
window.testClick.innerHTML=str;
}
//这种方式通过条件确定，是否把已经存在的东西显示出来。FireFox可以支持该方法，为了程序的移植性，最好选用这一种方式。
function hello(obj,idStr)
{
var d=document.getElementById(idStr);
if(d.style.display=='none')
{
  d.style.display='block';
  obj.innerHTML='回去';
}
else
{
  d.style.display='none';
  obj.innerHTML='出来';
}
}
</script>
</head>
<body>
<table>
<tr>
<td id=testClick>
<a href=# οnclick=tClick(1)>--></a>
</td>
</tr>
<tr>
<td>
<a href=# οnclick=hello(this,'helloddd')>出来</a>
<dd id=helloddd style=display:none>
  你好
</dd>
</td>
</tr>
</body>
</html>

再分享一下我老师大神的人工智能教程吧。零基础！通俗易懂！风趣幽默！还带黄段子！希望你也加入到我们人工智能的队伍中来！https://blog.csdn.net/jiangjunshow

利用innerHTML实现隐显效果-两种实现方法相关推荐

利用CSS让元素垂直居中的两种实现方法
利用CSS让元素垂直居中是个很头疼的问题,这里就介绍两种简单实用的方法方法一:利用行高(line-height)定位 line-height通常是用于调节一段文字的行与行之间的距离,或者说两行文字之 ...
ML之4PolyR：利用四次多项式回归4PolyR模型+两种正则化(Lasso/Ridge)在披萨数据集上拟合(train)、价格回归预测(test)
ML之4PolyR:利用四次多项式回归4PolyR模型+两种正则化(Lasso/Ridge)在披萨数据集上拟合(train).价格回归预测(test) 目录输出结果设计思路核心代码输出结果设 ...
ML之RFDT：利用RF(RFR)、DT(DTR)两种算法实现对boston(波士顿房价)数据集进行训练并预测
ML之RF&DT:利用RF(RFR).DT(DTR)两种算法实现对boston(波士顿房价)数据集进行训练并预测目录输出结果实现代码输出结果 1.两种算法的预测结果 2.回归树的可视化 ...
C#WPF实现TextBox控件水印效果的两种实现方法
C#WPF实现TextBox控件水印效果的两种实现方法在WPF实际项目中往往需要在TextBox中加入水印,来告诉使用者输入TextBox中的内容,如下图片所示: 下面介绍两种方式,来添加上图中的水 ...
android中view手势滑动冲突的两种解决方法
android中view手势滑动冲突的解决方法,主要解决方法有两种,外部和内部拦截.有需要的可以参考下. Android手势事件的冲突跟点击事件的分发过程息息相关,由三个重要的方法来共同完成,分别是: ...
快速排序的两种实现方法(c语言版本)
经过调研发现,对任意无序整数数组,快速排序有两种实现方法,这里简单阐述下思路: 思路一:随意选择一个基准元,一般选择数组的起始元或末尾元,Weiss这本书上特意搞了个算法来选择基准元,--,总之就是基 ...
day030进程的两种创建方法，验证进程的空间隔离，join等待子进程
本节内容: 1.操作系统的简单介绍 2.进程的两种创建方法 3.进程之间是空间隔离的, 参考文章: 一.操作系统的简单介绍 1.操作系统简单介绍操作系统就是一个协调.管理和控制计算机硬件资源和软件资 ...
给TextView设置图片的两种实现方法
有时在开发过程中,我们会有在TextView中添加图片的需求(比如下图箭头所指文字中的表情).而在xml中对Textview进行属性设置时,只能设置图片在TextView的左.右.上.下四个位置,不能 ...
gensim中动态主题模型（DTM）两种实现方法（一）
目录 (一)gensim.models.ldaseqmodel包 1.基本使用方法 2.缩水的地方 (二)gensim.models.wrappers.dtmmodel.DtmModel包 1.没有c ...

利用innerHTML实现隐显效果-两种实现方法

利用innerHTML实现隐显效果-两种实现方法相关推荐

最新文章

热门文章