document.createElement方法的使用
我们在使用createElemen方法t创建一个元素节点的时候,似乎在IE下面怎么写都可以,但切换到FF等其它浏览器却总是会报错。
比如我们要创建一个input元素,那么在IE下,我们可以有多种写法:
要测试某种情况,请将其它情况注释:
<script type="text/javascript">
//第一种,连同属性一起被创建
var x = document.createElement("<input type='text' size='30' />");
//第二种,以空标签形式创建
var x = document.createElement("<input />");
//第三种,以tagName形式创建
var x = document.createElement("input ");
document.body.appendChild(x);
</script>
以上3种方式在IE中均可以通行,然后再非IE核心的浏览器中(如FF,OP,SF等),前2种写法均会报错,无法正确创建这个input元素。
标准写法为第3种,放之各浏览器而皆准。
由于在IE中使用createElement方法创建元素节点时,该元素的属性可以一起被创建,但这在其它浏览器中是行不通的,所以我们还得通过其它的方式来创建其属性。
创建一个带属性的元素节点的标准写法:
<script type="text/javascript">
var x = document.createElement("input");
x.setAttribute("type","text");
x.setAttribute("size","30");
document.body.appendChild(x);
</script>
增加一个属性就document.setAttribute("attribute","value")一次。
后来发现其实还可以这样来写:
<script type="text/javascript">
var x = document.createElement("input");
x.type = "text";
document.body.appendChild(x);
</script>
但使用这种来创建属性,好像并不是素所有的属性都能被创建,比如input的size,value,class等用这种方式就无法创建,至于具体原因我还不大清楚。所以推荐使用前面那种写法。
document.createElement方法的使用的更多相关文章
- console.log的一个应用 -----用new方法生成一个img对象和document.createElement方法创建一个img对象的区别
我用两种方法来生成img对象,第一种方法是用new方法,第二种方法是用document.createElement方法. var img1 = new Image(); var img2 = docu ...
- JavaScript 覆盖document.createElement 方法 解决window.close在火狐下不兼容问题)
近期项目遇到了问题,有个asp.net web程序仅仅能在IE7 执行.如今xp都淘汰了,大家都用IE8-IE11,因此这个web app也须要升级 适应全部IE版本号.照成IE版本号不兼容的问题主要 ...
- JavaScript 覆盖document.createElement 方法
最近项目遇到了问题,有个asp.net web程序只能在IE7 运行,现在xp都淘汰了,大家都用IE8-IE11,因此这个web app也需要升级 适应所有IE版本.照成IE版本不兼容的问题主要来致d ...
- document.createElement()方法
document.createElement()是在对象中创建一个对象,主要和appendChild() 方法或者insertBefore() 方法联合使用. appendChild() 方法在节点的 ...
- 简化document.createElement("div")动态生成层方法
我们在WEB开发时,很多时候往往需要我们 JavaScript 来动态建立 html 元素,动态的设置相关的属性.比方说我们想要建立一個 div 层,则可以使用以下代码实现. 一.直接建立functi ...
- 摘抄 - 不为人知的JS调用样式的方法---document.createElement().addRule(..)
很多人可能在调用css样式都是使用传统的方式调用其实有很多方法可以进行调用,如使用内嵌样式,在html直接加入样式,给定外部样式文件,在外部样式文件中使用 @import url(样式文件路径),这些 ...
- js document.createElement()的用法 (转)
document.createElement()的用法 分析代码时,发现自己的盲点--document.createElement(),冲浪一番,总结了点经验. document.createElem ...
- document.createElement
document.createElement()的用法 document.createElement()是在对象中创建一个对象,要与appendChild() 或 insertBefore()方法联合 ...
- document.createElement()的用法<> 加强我对陌生代码的理解!
document.createElement()的用法 分析代码时,发现自己的盲点——document.createElement(),冲浪一番,总结了点经验. document.createElem ...
随机推荐
- how to increase an regular array length in java?
Arrays in Java are of fixed size that is specified when they are declared. To increase the size of t ...
- angular、bootstrap初稿搭建
1.bootstrap3.0中,ie8不兼容响应式设计 @media,需要添加如下2个查件 <!-- html5.js for IE less than 9 --> <!-- ...
- Spring Security-用户密码自定义加密
public class SunPasswordEncoder implements PasswordEncoder{ //@实现加密的方法,既将明文转换为密文的方法 public String en ...
- SQL 比较中文字符串
/* declare @str1 varchar(200),@str2 varchar(200) set @str1=N'江西省南昌市其它区高新区火炬大道809号' set @str2=N'江西省南昌 ...
- ibatis resultMap 结果集映射
1.结果集映射 就是将返回的记录,逐个字段映射到java对象上:如果数据库字段与java对象的成员变量名对应的话,则使用resultClas即可 2.实现 结合 ibatis初探这篇文章中提到的pro ...
- php UNIX时间戳转换为指定日期格式
用函数: date() 一般形式:date('Y-m-d H:i:s', unix时间) $date_unix=time();//获取当前时间,unix时间戳 echo 'Unix时间:'.$date ...
- 全文检索工具推荐FileLocator
全文检索工具推荐FileLocator https://www.baidu.com/link?url=_vaDZaJ_OePrAX-BTUD5hjTymnvN7_1oIAnWyS25hqxAg0nUH ...
- SQL Server 2008 2005删除或压缩数据库日志的方法
由于数据库日志增长被设置为“无限制”,所以时间一长日志文件必然会很大,一个400G的数据库居然有600G的LOG文件,严重占用了磁盘空间.由于主要是做OLAP,所以数据库本身不会有大变动,所以日志也就 ...
- XAMPP(v1.83)中的PHP(v5.5.15)访问SQLServer2014
驱动安装: 1. 下载SQLServer的微软官方PHP驱动,http://msdn.microsoft.com/en-us/sqlserver/ff657782.aspx 2. 安装SQLSRV31 ...
- php 四种基础算法 ---- 插入排序法
3.插入排序法 插入排序法思路:将要排序的元素插入到已经 假定排序号的数组的指定位置. 代码: function insert_sort($arr) { //区分 哪部分是已经排序好的 / ...