查找字体大小超过指定的元素

我正在尝试定义一个JQuery语句,用于查找具有比输入值更大(或更小) font-size元素。

可能的输入值:

 "12px" "14pt" "120%" and so on... 

我的第一种方法更多的是草案,因为它不能以这种方式工作。 但也许你有想法如何实现解决方案。 这是我到目前为止(输入值来自其他地方并且是可变的):

 $('*').filter(function() { return $(this).css('font-size') > '12px'; }) 

任何人?

更新

我被要求解释为什么我需要这样的东西。 我正在使用Java中的Selenium2编写API,它能够以更简单,更可靠的方式查找元素并与它们进行交互。 这个函数允许我编写像browser.find().titleElements()这样的代码,它选择所有h1h2 ,…标签,以及字体大小比页面上的平均文本大的元素。

该框架还将提供选择视觉上彼此靠近或在特定方向上的元素的function:

 HtmlElement nameLabel = browser.find().labelElement("name"); HtmlElement nameInput = browser.find().closestInputElement(nameLabel); nameInput.below("tos").select(); 

我做了一个小插件,可以获取你要求的所有参数。 不知道自从我匆匆做出来以来有多准确。 如果您的DPI不是72,那么pt肯定会被关闭。

插件代码

 (function($){ $.fn.filterByFontSize = function(size){ // Local scope vars var relative = false, matches = size .toString() .match(/^\d+(?:\.\d+)?(pt|em|%)$/i); // Parse size size = parseFloat(size, 10); // Check matches if (matches !== null) { switch (matches[1]) { case "pt": size = size*96/72; break; case "em": relative = true; break; case "%": relative = true; size = (size/100)+0.01; break; } } // Filter elements accordingly return this.filter(function(){ var $this = $(this), thisSize = parseInt( $this.css("font-size"), 10); if (relative) { var parent = $this.parent(); if (parent[0] === document) { parent = $(document.body); } var parentSize = parseInt( parent.css("font-size"), 10); return parentSize*size < thisSize; } else { return thisSize > size; } }); }; })(jQuery); 

用法

 var bigTextElements = $("h1,h2,h3,p").filterByFontSize("24px"); 

你可以在jsFiddle上的这个测试用例中试一试 。

转换器的额外信用,以帮助优化。

您可以使用parseint,如下所示:

 function greaterThan(e, size = 12) { if (parseInt(e.css('font-size')) > size) { return true; } return false; } 

并称之为:

 var isBigger = greaterThan($(this)); 

你需要解析字体大小……

试试这种方式..

 $('*').filter(function() { return parseInt($(this).css('font-size')) > '12px'; })