gulp中使用jquery语法处理DOM

最新推荐文章于 2025-11-16 01:52:43 发布

原创最新推荐文章于 2025-11-16 01:52:43 发布 · 1.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#gulp #jquery #dom

React 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一个Gulp插件，该插件利用jsdom和jQuery简化了对HTML文件的DOM操作过程。通过简单的配置即可实现对HTML元素的选择与修改。

[在gulp中使用jquery语法处理DOM]

Gulp plugin for generic DOM manipulation by jQuery grammar.

This Gulp plugin is a simple wrapper around jsdom and jQuery making it possible to run DOM operations on any inbound HTML by jQuery grammar.

This Gulp plugin depend on jquery, jsdom and console-color-mr。

jquery
jsdom
console-color-mr

Installation

npm install gulp-jquery-mr --save-dev

Install dependencies

npm install jquery jsdom console-color-mr --save-dev

Simple Example

const gulp = require('gulp');
const gulpJquery = require('gulp-jquery-mr');

gulp.task('handleHtml', function () {
	return gulp.src('test/index.html')
		.pipe(gulpJquery(function ($) {
			$('#test').html('Hello Michael Ray');
		}))
		.pipe(gulp.dest('test/build'));
});