以jQuery样式编辑操纵DOM的HTML文件

本文关键字：HTML 文件 DOM 操纵 jQuery 样式 编辑 | 更新日期: 2023-09-27 17:49:36

我有一批HTML文件，需要一些易于使用jQuery执行的版本(主要是选择一些节点并更改其属性)。

我实现这一目标的方法是在Google Chrome中逐一打开它们，在控制台上执行jQuery代码，然后将生成的DOM复制回我的HTML编辑器。

由于我目前正在做的事情需要很多时间，而且由于每个文件都需要相同的版本(即，相同的jQuery/JS代码将适用于每个HTML文件)，我正在考虑写一个脚本/程序来做到这一点。

无论如何，我不完全清楚我应该采取以下哪一种方法来完成这项任务。

  1. 用jQuery编写一个JavaScript脚本，使用一些文件系统/文件操作库(哪一个?)

  2. 编写Java或c#程序使用一些基于jquery的库(如CsQuery)

  3. 为我的一些编辑器 (Aptana, notepad++， Eclipse等)找到一个插件，或者一个完全不同的编辑器，支持类似jquery的编辑命令(就像notepad++ regex替换支持)。这将是缓慢的大批量，但至少它可以让我避免恼人的复制/粘贴到/从Chrome。

这些方法中的一个是完成我需要的的正确方法吗?(是否有正确的方法做到这一点?)哪个应该更直接?

我认为第2点对我来说更容易，因为我在Java和c#方面的经验比JavaScript丰富得多，但我认为这个想法可能有点像用大锤砸坚果。

以jQuery样式编辑操纵DOM的HTML文件

你应该考虑使用PhantomJs。它是一个可以从命令行执行的无头WebKit。它接受javascript或coffeescript文件作为参数，可以用于例如对网页做一些事情。下面是一个例子:

var page = require('webpage').create();
   page.open('http://m.bing.com', function(status) {
      var title = page.evaluate(function(s) {
         return document.querySelector(s).innerText;
      }, 'title');
      console.log(title);
      phantom.exit();
   });

我不确定正确的方法，但听起来你对c#很熟悉，并且会认为编写类库将是自动化的最小开销。以下是一些可能的解决方案:

  1. 脚本库(例如，c# . net) -如果你想使用DOM操作，你可以使用你提到的库或ScriptSharp之类的东西。如果HTML有适当的结束标签，你也可以使用LINQ来轻松地导航HTML(或者像CodePlex上的HTML Agility Pack)。我甚至建议在c#中使用Mustache和HTML文件模板。

  2. JavaScript库 -如果你想保持纯JavaScript，你可以使用Node.js。你可以使用一些文件操作库

  3. 无头浏览器 -还没有想过能够自动保存生成的HTML，但你可以使用jsTestDriver或Phantom.js

你也可以在编辑器中使用插件，但我会坚持使用Java, c#， python等库，你可以从现有的应用程序或调度中调用它们作为作业/服务。

相关文章：