关于js的函数
1、获取内容的兼容函数
/*
* 一: 获取内容的兼容函数
* setText(obj, str)
* 思路:
* 1、首先判断浏览器;
* 2、如果是IE浏览器,就用innerText;
* 3、如果是非IE浏览器,就用textContent;
* 参数说明:
* 1、如果是一个参数,这个函数将会用来获取内容
* 2、如果是两个参数,这个函数将会用来设置内容
* */
function getText(obj, str) {
// 判断是否是IE浏览器,如果obj.innerText == ture,则是IE浏览器,否则是非IE浏览器
if(obj.innerText) {
// 判断是否传入str,如果传入,就将传入的参数赋值给对象;如果没有传入,就直接返回对象的内容,
if(str) {
obj.innerText = str;
} else {
return obj.innerText;
}
} else {
if(str) {
obj.textContent = str;
} else {
return obj.textContent;
}
}
}
2、获取样式的兼容函数;
/*************************************************************************************************************
* 二:获取样式的兼容函数
* getStyle(obj, attr);
* 思路:
* 1,首先判断浏览器,
* 2,如果是IE浏览器,就用obj.currentStyle[attr];
* 3,如果是非IE浏览器,就用document.defaultView.getComputedStyle(obj, null)[attr];
* 参数说明:
* 参数1:是要获得样式的对象;
* 参数2:要从对象里面获取的样式,要以字符串的形式传入;
* */
function getStyle(obj, attr) {
// 判断是不是IE浏览器,如果obj.currentStyle == true,说明是IE浏览器,否则是非IE浏览器
if(obj.currentStyle) {
return obj.currentStyle[attr];
} else {
return document.defaultView.getComputedStyle(obj, null)[attr];
}
};
3、获取指定元素的子元素的集合和有意义的文本,默认情况为获取元素的节点;
/*************************************************************************************************************
* 三:获取指定元素的子元素的集合和有意义的文本,默认情况为获取元素的节点;
* getChild(obj, type);
* 思路:
* 获取obj的所有的子元素
* 挑选:obj.nodeType == 1说明就是元素集合,否则就是文本元素的集合
* 参数说明:
* 参数1:指定的元素;
* 参数2:指定获取元素的类型;
* true:只获取元素的节点;
* false:获取元素的节点和有意义的文本节点;
* */
function getChild(obj, type) {
var type = type == undefined ? true : false,
arr = [];
var child = obj.childNodes;
if(type) { //type==true||undefined的时候执行;
for(var i = 0; i < child.length; i++) {
if(child[i].nodeType == 1) {
arr.push(child[i]);
};
};
return arr;
} else {
for(var i = 0; i < child.length; i++) {
//replace.();把空白替换掉:str="a b c"-------str=["a","b","c"]
if(child[i].nodeType == 1 || (child[i].nodeType == 3 && child[i].nodeValue.replace(/^\s+|\s+$/g, "") != "")) {
arr.push(child[i]);
};
};
return arr;
};
};
4、获取第一个子元素
/************************************************************************************************************
* 四:获取第一个子元素;
* */
function getFirstChild(obj) {
return getChild(obj)[0];
};
5、获取最后一个子元素
/***********************************************************************************************************
* 五:获取最后一个子元素;
* */
function getLastChild(obj) {
var length = getChild(obj).length;
return getChild(obj)[length - 1];
}
6、获取任意的子元素
/**********************************************************************************************************************
* 六:获取任意的子元素;
* */
function getRandomChild(obj, num){
return getChild(obj)[num-1];
}
7、获得目标对象的下一个兄弟节点,如果有下一个兄弟节点的话,如果没有,返回false;
/***************************************************************************************************************
* 七:获得目标对象的下一个兄弟节点,如果有下一个兄弟节点的话
* getNext(obj, type);
* 思路:
* 1、判断是否有下一个兄弟节点,如果没有的话,返回false,如果有的话,继续往下进行;
* 2、判读next是否是一个有意思的文本节点或者元素节点;
* 3、更新next,即给next赋值。继续往下寻找下一个兄弟节点;
* 4、判断next是否是一个空值,如果为空,返回false,如果不为空,继续进行第二步;
* 参数说明:
* 1、obj:指定的对象;
* 2、type为true时:忽略文本,也是默认值;type为false时,不能忽略文本;
* */
function getNext(obj, type) {
var type = type == undefined ? true : type;
var next = obj.nextSibling;
checkNext(next);
if(type) {
// 忽略文本
// 当next是一个注释节点或者文本节点时,继续往下循环;
while(next.nodeType == 3 || next.nodeType == 8) {
next = next.nextSibling;
checkNext(next);
}
return next;
} else {
// 不能忽略文本
// 当next的类型是一个注释或是文本时,继续往下循环;
while(next.nodeType == 8 || (next.nodeType == 3 && next.nodeValue.replace(/^\s+|\s+$/g, '') != '')) {
next = next.nextSibling;
checkNext(next);
}
} // 返回false封装成方法
function checkNext(nextObj) {
if(nextObj == null) {
return false;
}
}
}
8、给最前面的元素插入一条元素
/*****************************************************************************************************************
* 八:给最前面的元素插入一条元素
* beforeChild(obj, ele)
* 思路:
* 1、获取第一个子元素firstChild
* 2、父元素.insertBefore(要插入的元素,firstChild);
* 参数说明:
* 1、obj:父元素;
* 2、ele:要插入的元素
* */
function beforeChild(obj, ele) {
var first = getFirstChild(obj);
obj.insertBefore(ele, first);
};
9、给某个元素后面插入一条子元素;
/************************************************************************************************************************
* 九:给某个元素后面插入一条子元素
* insertAfter(obj,ele,type)
* 思路:
* 1、首先获取第一个兄弟节点,调用之前的getNext(obj, type)函数;
* 2、看是否有下一个兄弟节点,如果有,往下一个兄弟节点的前面插入元素。如果没有,直接插入到父元素的后面;
* 参数说明:
* 1、obj:要插入的位置;
* 2、ele:要插入的元素;
* 3、type:
* true:忽略文本(元素节点和false是getNext(obj, type)返回的值)
* false:不能忽略文本;
* */
function insertAfter(obj, ele, type) {
// 初始化参数
var type = type == undefined ? true : type,
next = getNext(obj, true),
parent = obj.parentNode;
if(next) {
// next == true时,将ele插入到next后面;
parent.insertBefore(ele, next);
} else {
// next == false时,将ele直接插入到parent即可;
parent.appendChild(ele);
}
}
10、获取上一个兄弟节点;与获取下一个兄弟节点类似。
/************************************************************************************************
* 十、获取上一个兄弟节点;
* getPrevious(obj, type);
* */
function getPrevious(obj, type) {
var type = type == undefined ? true : type,
next = obj.previousSibling;
checkNext(next);
if(type) {
// 忽略文本
// 当next的类型是一个注释或是文本时,继续往下循环;
while(next.nodeType == 8 || next.nodeType == 3) {
next = next.previousSibling;
checkNext(next);
}
return next;
} else {
// 不忽略文本
// 当next的类型是一个注释或是文本时,继续往下循环;
while(next.nodeType == 8 || (next.nodeType == 3 && !(next.nodeValue.replace(/^\s+|\s+$/g, '')))) {
next = next.previousSibling;
checkNext(next);
}
return next;
}
// 判断next的函数
function checkNext(nextObj) {
if(nextObj = null) {
return false;
}
};
}
11、
关于js的函数的更多相关文章
- JS回调函数全解析教程
转自:http://blog.csdn.net/lulei9876/article/details/8494337 自学jQuery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速g ...
- 学习js回调函数
<!DOCTYPE HTML> <html> <head> <meta charset="GBK" /> <title> ...
- 如何理解JS回调函数
1.回调函数英文解释: A callback is a function that is passed as an argument to another function and is execut ...
- Atitit java方法引用(Method References) 与c#委托与脚本语言js的函数指针
Atitit java方法引用(Method References) 与c#委托与脚本语言js的函数指针 1.1. java方法引用(Method References) 与c#委托与脚本语言js ...
- 【转】关于URL编码/javascript/js url 编码/url的三个js编码函数
来源:http://www.cnblogs.com/huzi007/p/4174519.html 关于URL编码/javascript/js url 编码/url的三个js编码函数escape(),e ...
- js引出函数概念的案例
js引出函数概念的案例 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8&q ...
- prototype.js $F()函数介绍
$F()是一个能够简化编码量的函数, 对于字段输入控件有效,包括input.textarea.select等,该函数的输入参数为这些输入控件元素对象的id或元素对象本身,函数负责返回 这些输入控件元素 ...
- JS匿名函数的理解
js匿名函数的代码如下:(function(){ // 这里忽略jQuery 所有实现 })(); 半年前初次接触jQuery 的时候,我也像其他人一样很兴奋地想看看源码是什么样的.然而,在看到源码的 ...
- js回调函数(callback)理解
Mark! js学习 不喜欢js,但是喜欢jquery,不解释. 自学jquery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速google之,发现原来中文翻译成回调.也就是回调函 ...
- JS回调函数(callback)
在使用Jquery的时候,用到Callback(),回调函数的概念.而且很多. 比如: $.ajax({ url:"test.json", type: "GET" ...
随机推荐
- 常用js正则表达式大全
常用js正则表达式大全.一.校验数字的js正则表达式 1 数字:^[0-9]*$ 2 n位的数字:^\d{n}$ 3 至少n位的数字:^\d{n,}$ 4 m-n位的数字:^\d{m,n}$ 5 零和 ...
- ssm又乱码
以前用mybatis的时候是这样的 mysql.connection.url=jdbc:mysql://localhost:3306/test?useUnicode=true&characte ...
- [BZOJ3011][Usaco2012 Dec]Running Away From the Barn
题意 给出一棵以1为根节点树,求每个节点的子树中到该节点距离<=l的节点的个数 题解 方法1:倍增+差分数组 首先可以很容易的转化问题,考虑每个节点对哪些节点有贡献 即每次对于一个节点,找到其第 ...
- 【AtCoder】ARC077
C - pushpush 如果是按下标说的话 如果是偶数个 那么是 \(N,N - 2,N - 4...1,3,5...N - 1\) 如果是奇数个 \(N,N - 2,N - 4...2,4,6.. ...
- net core体系-web应用程序-4asp.net core2.0 项目实战(1)-8项目加密解密方案
本文目录1. 摘要2. MD5加密封装3. AES的加密.解密4. DES加密/解密5. 总结 1. 摘要 C#中常用的一些加密和解密方案,如:md5加密.RSA加密与解密和DES加密等,Asp.N ...
- Python学习(二十四)—— 前端基础之Bookstrap
转载自:http://www.cnblogs.com/liwenzhou/p/8214637.html 一.Bootstrap介绍 Bootstrap是Twitter开源的基于HTML.CSS.Jav ...
- docker inspect命令
docker inspect -f {{.NetworkSettings.Networks.crawling_pro.NetworkID}} crawling_internationalmacro_p ...
- 给定两个有序整数数组 nums1 和 nums2,将 nums2 合并到 nums1 中,使得 num1 成为一个有序数组
题目描述: 给定两个有序整数数组 nums1 和 nums2,将 nums2 合并到 nums1 中,使得 num1 成为一个有序数组. 说明:初始化 nums1 和 nums2 的元素数量分别为 m ...
- 在jsp页面上方定义<style> 可以自定义class的样式
<style>.border-orange{ border:1px solid orange; width:120px; box-sizing: border-box; margin-bo ...
- 实现Java简单继承
面向对象练习-简单继承 一.完成教师类的创建 说明: id 代表身份证号 name 表示姓名 birth 表示出生日期 title 表示职称(讲师,副教授,教授等) 二.完成学生类的创建 说明: ma ...