首页 > 其他 > 详细

DOM 扩展

时间:2015-01-05 18:40:04      阅读:230      评论:0      收藏:0      [点我收藏+]

1. 呈现模式

document.compatMode == "CSS1Compat"; 标准模式

document.compatMode == "BackCompat"; 混合模式

if(document.compatMode == "CSS1Compat"){
    return "SATAND";
}else{
    return "Quirks";
}

2. 操作内容

a. innerText

设置和获取文本节点字符串

IE、Safari、Opera、Chrome支持innerText属性

FireFox 支持textContent属性

utils.getInnerText = function(element){
		return (typeof element.textContent == "string") ? element.textContent:element.innerText;
	}

	utils.setInnerText = function(element,text){
		if(typeof element.textContent == "string")
			element.textContent = text;
		else
			element.innerText = text;
	}

b. innerHTML

设置文本几点字符串是和innerText 一样

通过innerHTML 插入<script> IE支持,但是必须设置 defer特性,但是必须添加作用域元素

div.innerHTML = "_<script defer> alert();</scr"+"ipt>";  // 多出一个_ 文本节点

div.innerHTML = "<input type=\"hidden\"><script defer>alert();</scr" + "ipt>"; // 使用隐藏的<input>字段,而且不影响页面布局。

插入<style>

//Opera Firefox ie

div.innerHTML = "_<style type=\"text/css\">body {background-color:red;}</style>";

div.removeChild(div.firstChild);

//safari chorme

document.getElementsByTagName("head")[0].appendChild(div.firstChild);

 

Opera Firefox ie 需要一个前置作用域,添加完删除第一个文本节点。
safari chorme 必须将style 元素放到head中,否则会忽略它

不支持innerHTML的元素有

[<col>、<colgroup>、<frameset>、<head>、<html>、<style>、<table>、<tbody>、<thead>、<tfoot>、<title>、<tr>]

DOM 扩展

原文:http://www.cnblogs.com/lcw5945/p/4204118.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!