淘先锋技术网

首页 1 2 3 4 5 6 7

DOM 是 Document Object Model 的缩写,是一种用于表示和操作 HTML、XML 等文档的标准,分为文档节点、元素节点、属性节点、文本节点等。jQuery 是一种基于 JavaScript 的框架,用于简化 HTML 文档的遍历、操作、事件处理等操作。下面是一些 DOM 转为 jQuery 的示例。

// 获取元素节点
// DOM
var elem = document.getElementById('demo');
// jQuery
var elem = $('#demo');
// 获取属性节点
// DOM
var attr = elem.getAttribute('title');
// jQuery
var attr = elem.attr('title');
// 添加、删除、修改样式
// DOM
elem.style.color = 'red';
elem.classList.add('active');
elem.classList.remove('inactive');
// jQuery
elem.css('color', 'red');
elem.addClass('active');
elem.removeClass('inactive');
// 获取、设置元素内容
// DOM
var content = elem.innerHTML;
elem.innerHTML = 'Hello world';
// jQuery
var content = elem.html();
elem.html('Hello world');
// 获取、设置表单值
// DOM
var input = document.getElementById('input');
var value = input.value;
input.value = 'John Doe';
// jQuery
var input = $('#input');
var value = input.val();
input.val('John Doe');

使用 jQuery 可以简化许多 DOM 操作,让代码更加易读、简洁。注意在使用 jQuery 时,要遵循它的语法规则,例如选择器使用 $() 包裹,属性方法使用 .attr()、.css()、.html() 等等。