0

我有一个充满单元格的表格，如下所示：

<tr class="dataRow odd">
    <td class="actionColumn"> someAction </td>
    <th class=" dataCell  booleanColumn" scope="row">
        <img class="checkImg" width="21" height="16" title="Not Checked" 
            alt="Not Checked" src="/img/checkbox_unchecked.gif">
        </img>
    </th>
    <td class=" dataCell  "> SomeData </td>
</tr>


中间<th>单元格将有一个带有title="Not Checked"或的图像title="Checked"。

如果title="Not Checked". 但是，我是 Greasemonkey 和 javascript 和 CSS 的新手。

我发现了这个类似的问题，但我不完全确定如何适应它。这看起来很接近，但不太正确，我不完全确定如何简单地更改行的 FG/BG 颜色。 

var targetLinks = $("tr *dataRow*");

//--- Loop through the links and rewrite images that are in the same row.
targetLinks.each ( function () {
  //--- This next assumes that the link is a direct child of tr > td.
  var thisRow = $(this).parent ().parent ();

  //--- This may need tuning based on information not provided!
  var image  = thisRow.find ("img");

  //--- Replace all target images in the current row.
  if ("Not Checked" == image.attr ('title')) {
      //Apply Some formatting to thisRow   
    } 
  );
}

指针将不胜感激！

4

1 回答 1

1

我认为，这比链接的示例要容易一些。
关键是理解jQuery 选择器，然后使用 jQuery 的.css()功能。

假设该页面不使用 AJAX，这里有一个适用于您提供的 HTML的完整脚本：

// ==UserScript==
// @name     _Format the "not checked" rows
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
// @grant    GM_addStyle
// ==/UserScript==
/*- The @grant directive is needed to work around a design change
    introduced in GM 1.0.   It restores the sandbox.
*/
//--- The 'Not Checked' is case-sensitive
var notChkdRows = $(
    "tr.dataRow:has(th.booleanColumn img[title='Not Checked'])"
);

//--- Use whatever CSS you wish
notChkdRows.css ( {
    "background":   "lime",
    "font-size":    "3ex"
} );

//--- But some styles do not effect rows, must use on cells
notChkdRows.children ("td,th").css ( {
    "border":       "5px solid pink"
} );


您可以在 jsFiddle 上玩代码的现场演示。

于 2013-06-03T22:41:13.423 回答