Nodejs使用jQuery选择器操作DOM

Nodejs使用jQuery选择器操作DOM
注:这是两年多的老项目,所以你可以在Nodejs选择器使用jQuery,作为后台操作前端DOM HTML / XML,在浏览器兼容的代码去除,比jsdom运行快8倍。我们之前提到的jsdom有严重的性能问题:调试调试js:我们是内存泄漏和无限循环的位置

再见

快速,灵活,在jQuery服务器端使用。

简介

测试服务器端HTML:

复制代码代码如下所示:

VaR再见=需要('cheerio),

$ = cheerio.load('Hello World);

('h2美元。标题)。文本(你好那里!);

$('h2)。AddClass(欢迎你);

$ html();

在那里您好!
安装

新安装的再见

功能

熟悉语法:再见了jQuery核心子集。再见移除所有DOM不一致和浏览器的兼容性支持jQuery库,展示其真正华丽的API。

快速:再见使用一个非常简单的、一致的DOM模型,解析、操作和演示将带来令人难以置信的性能改进。结束的基准测试显示,再见是约8倍的速度比jsdom初步结束。

令人难以置信的灵活性:兼容htmlparser2api。再见可以分析几乎所有的HTML或XML文件。

jsdom怎么样

我说再见因为我越来越失望jsom。对我来说,有三个主要的症结,曾经一次又一次。

jsdom内置解析器太严格:jsdom HTML解析器捆绑现在无法处理许多流行的网站。

jsdom太慢:解析的大网站,jsdom具有明显的延迟。

jsdom感觉太重的jsdom的目的是提供在浏览器中看到我们同DOM环境(注*执行Javascript)。我真的不需要这些东西,我只是想要一个简单,做HTML操作熟悉的方式。

When to use JSDOM

再见不能解决你所有的问题。如果我需要在一个浏览器一样的环境中工作,我仍然会用jsdom,尤其是当我想在服务器上执行自动功能测试。

美国石油学会

我们将使用的HTML代码示例:

复制代码代码如下所示:
苹果

橙色


负荷

首先,你需要加载的HTML。这一步是jQuery自动完成的,因为jQuery运行在一瞬间DOM环境。我们需要通过HTML文档到再见。

这是第一选择:

复制代码代码如下所示:

VaR再见=需要('cheerio),

$ = cheerio.load('…');
此外,还可以将HTML作为字符串参数传递:

复制代码代码如下所示:

$ =需要('cheerio);

$('ul ','…');
或者作为根节点

复制代码代码如下所示:

$ =需要('cheerio);

$(李,'ul ','…');
您还可以加载默认的解析选项,您需要通过一个额外的加载()来修改这些选项:

复制代码代码如下所示:

$ = cheerio.load('…',{

NormalizeWhitespace:真的,

XmlMode:真的

});
这些解析选项是直接借用htmlparser2,所以任何参数,可用于htmlparser2也是有效的默认选项是再见:

复制代码代码如下所示:

{

NormalizeWhitespace:假,

XmlMode:假,

decodeentities:真

}
选择器选择器

再见的选择几乎是完全一样的jQuery一样,所以API是非常相似的。

复制代码代码如下所示:

$(选择器,{上下文},{ })
根据{根,一个可选的选择器:} >上下文{上下文,顺序选择元素可选}选择器。选择器和上下文可以是字符串表达式、DOM元素、DOM元素数组。根通常的文档是HTML文档的根元素。

像jQuery,这种选择方法遍历和操作文档的起点。它是从文档中选择元素的主要方法,但它并不建立cssselect图书馆(sizzle选择器)像jQuery。

复制代码代码如下所示:

$('。苹果',' #水果)文本()。

>苹果

('ul美元。梨)。Attr(' ')

>梨

$(李{类=橙})。Html()

>橙色
属性属性

获得和修改属性的方法。

attr(名称、值)。

用于获取和设置属性的方法。只获取匹配的第一个元素的属性值。如果将集合属性的值设为null,则删除属性。

复制代码代码如下所示:

$('ul)。Attr('id')

水果

$('苹果')。Attr('id','favorite)。Html()

>苹果
数据(名称,值)

获取和设置数据属性的一种方法。获取或设置仅用于匹配的第一个元素。

复制代码代码如下所示:

$(')。

/ / = > { applecolor:'}

$()。数据('data-apple-color)

/ / = >'

苹果= $(var,苹果),数据(和善的','陆委会')

apple.data(和善的)

/ / = > '陆委会'

缬氨酸({ })
方法用于获取和设置输入,选择,和文本值。注:支持地图功能尚未添加。

复制代码代码如下所示:

$(文本输入{类型=)(。Val)

/ / = > input_text

($'input{type= text.Val ) ('test') (.Html)
更多API,请参见官方网站

tag:操作选择器电脑软件nodejsjquery

相关内容