javascript 包裹节点
模仿jQuey,创建几个包裹节点的方法,发现jQuery的方法很低效啊,下一次他又可以说这几个方法可以提升了多少多少了。原理基本是这样,如果传入的是字符串,那么让它们变成一个元素节点,不过这元素节点也可以有许多层,在最内层把要包裹的元素放进。把字符串变成元素节点的方法有如下几个。1,createElement,IE可以连元素属性也一起创建,但只能创建一层。2,innerHTML,不过需要对原来的字符串进行处理,IE与FF都有许多意想不到的默认行为,可以为你多加一点东西或少加一点东西。3,createContextualFragment,由于Opera的行为有点怪异,需要选中修改元素的位置。经日本人的测试,它转换字符串成节点的效率比innerHTML高多了,也安全多了,真是强者愈强,弱者愈弱。如果是传入元素节点,需要克隆一下,要不都变成wrapAll。如果是函数,把当前元素传进去,利用它的某些属性创建一个包裹元素。
最初的实验品(这里的wrapOuter相当于jQuery的wrap):
var parseHTML = function(str) {
if(document.createRange){
var range = document.createRange()
range.setStartAfter(document.body)
return range.createContextualFragment(str)
}else{
return document.createElement(str)
}
}
var wrapOuter = function(target,html){
var wrap = parseHTML(html) ;
target.parentNode.insertBefore(wrap,target);
target.previousSibling.appendChild(target)
}
<!doctype html>
<html dir="ltr" lang="zh-CN">
<head>
<meta charset="utf-8"/>
<meta content="IE=8" http-equiv="X-UA-Compatible"/>
<style type="text/css">
.wrapper {
margin: 5px 5px 5px 5px;
padding: 5px 5px 5px 5px;
background-color:#dfe8f6;
border: 1px solid magenta;
}
.inner{
margin:1em;
height:20px;
background:#a9ea00
}
.border{
border:2px solid red;
}
</style>
<title>包裹节点 by 司徒正美</title>
<script type="text/javascript">
window.onload = func
相关文档:
JavaScript提供脚本语言的编程与C++非常相似,它只是去掉了C语言中有关指针等容易产生的错
误,并提供了功能强大的类库。对于已经具备C++或C语言的人来说,学习JavaScript脚本语言是一件非常轻松愉快的事。
一、JavaScript代码的加入
JavaScript的脚本包括在HTML中,它成为HTML文档的一部分。与HTML标识相结合, ......
/***************************by
garcon1986********************************/
感谢CSDN的shan1119 帮我解决Javascript部分的错误。
<mce:script language="JavaScript"><!--
function toggle(id,id2,id3) {
var state = document.getElementById(id).style.display;
if (state == 'block') {
......
第一题
(function(){
return typeof arguments;
})();
//问自动执行函数会返回什么值
// 就是考Arguments对象的typeof
// 看平时用firebug多不多了……
第二题
var f = function g(){ return 23; };
typeof g();
//问最后一行的执行结果
//根据标准,命名函数表达式的函数名只对函数 ......
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charse ......
网站经常用到的一个东西用来暂存一些相关信息的Cookie有优点也有缺点,它能够不占用服务器资源,存储在客户端的电脑里,可这样也有一定的危险性,因为相关信息比如说登录某个网站的用户名和密码之类的信息,都会存在客户端的电脑里,这样会被某些“有心之人”利用,所以,有些人习惯在公共场合使用完电脑后清掉Co ......