今天需要做个首页打开后,在头部出现一个展开动画的效果。本来是很容易的,加上那个展开代码就OK了。可是发现原来的程序的头部文件包括body部分都放在了head.html里,然后包含进来了。这样必须要在head.html里放入一个用于展开的div,可是这样一来,所有的页面均有了展开效果,可是我只需要在首页有这样的效果。 解决办法有两个:
1.将头部那个div的display设为none,然后调用js将其设为block。
2.通过js动态创建一个div并且将这div放在最前面。这就得多加几句话了,如下:
- <script language="javascript" type="text/javascript">
- var divObj=document.createElement("div");
- divObj.innerHTML="hi,欢迎访问 www.phpernote.com php 程序员教程网!";
- var first=document.body.firstChild; //得到第一个元素
- document.body.insertBefore(divObj,first); //在第原来的第一个元素之前插入
- </script>
下面分享一下如何在FireFox中动态创建html元素(利用createElement)
我们先来看看如下代码(这段代码是有问题的):
- <script type="text/javascript">
- function add(){
- var input=document.createElement("<input size=30 type=/"text/" name=/"extrachildren[]/">")
- var br=document.createElement("<br>");
- var br2=document.createElement("<br>");
- document.getElementById("children").insertBefore(br);
- document.getElementById("children").insertBefore(br2);
- document.getElementById("children").insertBefore(input);
- </script>
上面代码在IE中是可行的,但在FireFox中是不工作的。要想在FireFox中起作用必须换成如下代码:
- <script type="text/javascript">
- function add(){
- var input=document.createElement('input');
- input.setAttribute('size','30');
- input.setAttribute('type','text');
- input.setAttribute('name','extrachildren[]');
- var parent=document.getElementById('children');
- parent.insertBefore(document.createElement('br'),null);
- parent.insertBefore(document.createElement('br'),null);
- parent.insertBefore(input,null);
- }
- </script>
IE有3种方式都可以创建一个元素:
- document.createElement("<input type=text>")
- document.createElement("<input>")
- document.createElement("input")
而Firefox只支持一种方式:
- document.createElement("input");
- document.setAttribute(name,value);
零七网部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与零七网进行文章共享合作。