澳门足球盘

万博博彩官网电话王中王论坛 香港马会

javascript操作DIV总结

工作中,偶尔也会做做前台,每次都需要对一些简单的javascript和html标签进行重新学习,今天就稍微总结一下,主要是针对div的操作,也还包括一些其他基本控件。

一.div

1.设置div的显示或隐藏

代码片段

document.getElementById("div1").style.display="none";//隐藏

document.getElementById("div2").style.display="";//显示

当然也可以直接用如下方式显示:

代码片段

div1.style.display="none";//隐藏

div2.style.display="";//显示2.innerHTML,outerHTML,innerText,outerText

关于这四者的区别,网上有段经典的代码:

代码片段

<div id="div">

<input name="button" value="Button" type="button">

<font color="green">

<h2>This is a DIV!</h2>

</font>

</div>

<input name="innerHTML" value="innerHTML" type="button" OnClick="alert(div.innerHTML);">

<input name="outerHTML" value="outerHTML" type="button" OnClick="alert(div.outerHTML);">

<input name="innerText" value="innerText" type="button" OnClick="alert(div.innerText);">

<input name="outerText" value="outerText" type="button" OnClick="alert(div.outerText);">

从中可以很清楚的看出四者各自的功能:

innerHTML:在div里面的html标签,通过它可以方便的设置div里要显示的内容,如:

以下是引用片段

document.getElementById("div3").innerHTML="<strong>hhh</strong>";

outerHTMl:包括div在内的所有html标签

innerText:要在div里显示的文本,和outerText基本一样

值得注意的是,以上四个只有innerHTML在firefox下有效,其他均只在IE下可用

二.其他基本控件

假设页面上有一个text输入框:

代码片段

<input type="text" id="text1" value="" style="WIDTH:300px" maxlength=40>

style="WIDTH:300px":可以限定输入框的显示长度

maxlength=40:可以限制该输入框允许输入字符的最大长度

获取控件值或设置控件值可用:

代码片段

document.getElementById("text1").value="输入框";

值得注意的是,javascript是从头到尾编译的,因此在使用控件之前,一定要确保该控件已经被加载到了页面中。

作者Blog:https://blog.csdn.net/hbcui1984/

免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。

https://www.pick2012.cn/style/images/nopic.gif
我要收藏
个赞
被踩
分享到
分享
评论
首页