JS整理：getCookie, getElementsByClassName, 添加删除事件

在JavaScript开发中，我们经常会用到一些常用的方法和技巧。本文将为大家整理三个常用的JavaScript操作：getCookie、getElementsByClassName和添加删除事件。

1. getCookie

getCookie方法用于获取指定名称的Cookie值。

function getCookie(name) {
  var cookies = document.cookie.split(';');
  for (var i = 0; i < cookies.length; i++) {
    var cookie = cookies[i].trim();
    if (cookie.indexOf(name) === 0) {
      return cookie.substring(name.length + 1, cookie.length);
    }
  }
  return '';
}

使用方法示例：

var username = getCookie('username');
console.log('Username:', username);

2. getElementsByClassName

getElementsByClassName方法用于通过类名获取文档中的元素。

function getElementsByClassName(className) {
  if (document.getElementsByClassName) {
    return document.getElementsByClassName(className);
  } else {
    var elements = document.getElementsByTagName('*');
    var result = [];
    for (var i = 0; i < elements.length; i++) {
      var classNames = elements[i].className.split(' ');
      if (classNames.indexOf(className) !== -1) {
        result.push(elements[i]);
      }
    }
    return result;
  }
}

使用方法示例：

var elements = getElementsByClassName('highlight');
console.log('Elements:', elements);

3. 添加删除事件

添加删除事件方法用于在DOM元素上添加或删除事件。

function addEvent(element, event, handler) {
  if (element.addEventListener) {
    element.addEventListener(event, handler);
  } else {
    element.attachEvent('on' + event, handler);
  }
}

function removeEvent(element, event, handler) {
  if (element.removeEventListener) {
    element.removeEventListener(event, handler);
  } else {
    element.detachEvent('on' + event, handler);
  }
}

使用方法示例：

var button = document.getElementById('myButton');

function handleClick() {
  console.log('Button clicked!');
}

addEvent(button, 'click', handleClick);

// 稍后移除事件
removeEvent(button, 'click', handleClick);

以上是三个常用的JavaScript操作的整理。希望对大家在JavaScript开发中有所帮助！如有任何疑问或建议，请随时在下方留言。

本文来自极简博客，作者：灵魂导师酱，转载请注明原文链接：JS整理：getCookie, getElementsByClassName, 添加删除事件