学习js的过程中有几个有用的函数。

//添加事件函数
function addLoadEvent(func) {
var oldonload = window.onload;
if(typeof window.onload != "function"){
window.onload = func;
}else{
window.onload = function(){
oldonload();
func();
}
}
} //功能:将新节点newElement添加到目标节点targetElement之后
function insertAfter(newElement, targetElement){
//获取目标节点的父节点parent
var parent = targetElement.parentNode; if(parent.lastChild == targetElement){
//若目标节点是父节点的最后一个子节点则直接添加新节点
parent.appendChild(newElement);
}else{
//否则,在目标节点的下个兄弟节点之前添加新节点
parent.insertBefore(newElement, targetElement.nextSibling);
}
} //功能:将元素element添加一个类名value
function addClass(element, value){
if(!element.className){
//若元素类名为空,则直接赋值为value
element.className = value;
}else{
//若元素类名非空,则将value添加到原类名后
var newClassName = element.className;
newClassName += " ";
newClassName += value;
element.className = newClassName;
// element.className += " " + value;
}
}

【js编程艺术】 之有用的函数的更多相关文章

  1. 【js 编程艺术】小制作一

    最近在看js编程艺术,照葫芦画瓢,做了一个小网页.作为一枚前端渣渣,遇到了好多坑,在这里就不提了. 首先是html代码 /*gallery.html*/<!DOCTYPE html> &l ...

  2. 【js编程艺术】小制作六

    1.html /* movie.html*/<!DOCTYPE html> <html> <head> <meta charset="utf-8&q ...

  3. 【js编程艺术】小制作五

    1.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <ti ...

  4. 【js 编程艺术】小制作四

    1. html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <t ...

  5. 【js 编程艺术】小制作三

    1.html文件 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...

  6. 【js 编程艺术】小制作二

    首先是一个html文档 /* explanation.html */<!DOCTYPE html> <html> <head> <meta charset=& ...

  7. JS 编程艺术

    JS艺术片段剪贴 getFullDate: function (date) { //返回 YYYY年MM月DD日 var year = month = day = ' '; if (isNaN(dat ...

  8. JS编程练习:封装insertAfter函数(功能类似于系统insertBefor)

    那么insertAfter()要实现的功能: 在指定的子节点后面插入新的子节点: 1 <body> 2 <div> 3 <p></p> 4 <sp ...

  9. 《javascript dom编程艺术》笔记(一)——优雅降级、向后兼容、多个函数绑定onload函数

    刚刚开始自学前端,如果不对请指正:欢迎各位技术大牛指点. 开始学习<javascript dom编程艺术>,整理一下学习到的知识.今天刚刚看到第六章,记下get到的几个知识点. 优雅降级 ...

随机推荐

  1. jedis 连接redis

    一,  单机版连接 @Test public void testJedis() { //1. 创建jedis 对象 Jedis jedis = new Jedis("192.168.88.1 ...

  2. Java简易撞鬼游戏demo

    9*9方格内两点随机行走,相遇则停止. public class 撞鬼 { public static int length = 9; public static char[][] matrix = ...

  3. css变量的应用

    微软在2017年3月份宣布 Edge 浏览器将支持 CSS 变量,到现在已经过去一年多了,哈哈,是不是有点后知后觉? 这个知识点是在阮一峰的日志上浏览到的,在此借用一下了..跟大家分享一下..... ...

  4. 《LeetBook》leetcode题解(12):Integer to Roman[M]

    我现在在做一个叫<leetbook>的免费开源书项目,力求提供最易懂的中文思路,目前把解题思路都同步更新到gitbook上了,需要的同学可以去看看 书的地址:https://hk029.g ...

  5. JavaScript数据结构-16.二叉树计数

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. [中英对照]User-Space Device Drivers in Linux: A First Look | 初识Linux用户态设备驱动程序

    如对Linux用户态驱动程序开发有兴趣,请阅读本文,否则请飘过. User-Space Device Drivers in Linux: A First Look | 初识Linux用户态设备驱动程序 ...

  7. PTA (Advanced Level) 1013 Battle Over Cities

    Battle Over Cities It is vitally important to have all the cities connected by highways in a war. If ...

  8. Examples of GoF Design Patterns--摘录

    http://stackoverflow.com/questions/1673841/examples-of-gof-design-patterns You can find an overview ...

  9. 203_Removed-Linked-List-Elements

    目录 203_Removed-Linked-List-Elements Description Solution Java solution 1 Java solution 2 Python solu ...

  10. 使用 Angular 和 RxJS 实现的无限滚动加载

    无限滚动加载应该是怎样的? 无限滚动加载列表在用户将页面滚动到指定位置后会异步加载数据.这是避免寻主动加载(每次都需要用户去点击)的好方法,而且它能真正保持应用的性能.同时它还是降低带宽和增强用户体验 ...