首先我是由他自己和周围搞乱 javascript 已学习 noobie,我无意称为正则表达式的噩梦...我比较不知道一点儿的时候,我被做花哨的东西,但我被难住,并且我想让您的 calrify 这样给我︰

我已经阅读和创建匹配的方法的 lookig 和我踢的位置上很好的答案︰

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

var $rows = $('#table tr');
$('#search').keyup(function() {

var val = '^(?=.*' + $.trim($(this).val()).split(/s+/).join(')(?=.*') + ').*$',
    reg = RegExp(val, 'i'),
    text;

$rows.show().filter(function() {
    text = $(this).text().replace(/s+/g, ' ');
    return !reg.test(text);
}).hide();

});

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

我比较了解即将在那里但可能有人打破的转换它在 javascript 中' 为我使我可以更好地捕捉这一想法,我勉强可以做使用 jquery,因为我仍然在学习 javascript 很酷的东西,我知道有关 jqueries,但没有足够要完全了解他是否那里某些事项和足够的有关正则表达式了解的专家编写的代码是天才 < 3

这是什么我了解并请更正我︰

var $rows = $('#table tr'); 

它是中的作用,将在其中的目标在寻找匹配

pd︰ 这就是第一次我看到的 '$' 来声明变量和我已了解的它将其设置为 jquery 对象。.就是这一点。

var val = '^(?=.*' + $.trim($(this).val()).split(/s+/).join(')(?=.*') + ').*$',
    reg = RegExp(val, 'i'),
    text;

$.trim($(this).val()等于 $.trim($("#user_input").val());...正确吗?

reg = RegExp(val, 'i')

注册表变量用作一个构造函数来查找匹配项,将不区分大小写,但它是不是应该 reg = 新的 RegExp (val,我也是可以设置的 ')' 或者我吗?

这是我最会混乱时

$rows.show().filter(function() {
        text = $(this).text().replace(/s+/g, ' ');
        return !reg.test(text);
}).hide();

什么我可以理解为,匹配项将会显示仅是否他们传递文本变量来设置筛选器并不的那些将被隐藏,我没有什么$(this)相当于文本变量中的微小思想.并从那里对我有不知道这怎么回事,我发现.test() ,返回 true 或 false 时 regexp 对象中找到了匹配项,但为什么它有!开头?

感谢您的时间和快乐的新年 !

PD︰ 很抱歉我的英语,我是德国 XD

2014-12-31 00:00:00
问题评论:

正则表达式字符串构造的大多数情况下将某些字符串拆分成几个单词,然后断言以及将它们联接起来。结果字符串是类似^(?=.*word1)(?=.*word2)(?=.*word3).*$,这种没有word3 之后。Regex 本身是一个验证程序中的text !reg.test(text);不包含任何的这些 (否定)。不同的是,我不知道 JS 还不够。

回答:

$为 jQuery 对象,它是只是点到 jQuery 的变量的名称。不要担心关于 $rows,即只是另一个变量名。

var $rows = $('#table tr'); 

右手边基本上传递给 jQuery 并告诉它查找与之匹配的所有 DOM 元素选择器。如果您知道 CSS 这是相同的原则,#table 是与元素id="table"和结合tr意味着在该元素中选择所有行 (tr 所表行 html 标记)。

在纯 javascript 中这可以写成

var $rows = document.querySelectorAll("#table tr");

结果是元素的列表。

查找另一个元素,然后将附加事件侦听器︰

$('#search').keyup(function() { ... });

请注意这传递给 jQuery,返回所需的元素,将 keyup 事件附加到其上的另一个选择器。在 JavaScript 中,这可能是︰

document.getElementById("search").addEventListener("keyup", function() { ... });

当该 keyup 事件时触发执行函数时,该元素和您正在生成一个字符串,其中包含 val:

... + $.trim($(this).val()).split(/s+/).join(')(?=.*') + ...

this$(this).val()中的计算结果为找#search选择器,这种情况下一个输入的字段的元素。

这可能是以下纯 javascript 中︰

... + document.getElementById("search").value.trim().split(/s+/).join(')(?=.*') + ...

如果计算该表达式,它 1) 修整空白、 2) 将结果拆分成每个空白字符的字符串的数组,和 3) 加入该数组分隔符与)(?=.*

步骤 2) 和第 3) 基本上是String.replace(/s+/, ')(?=.*')但速度更快。

移至最后一位,jQuery show()方法应用于 $rows,这是该列表中的元素 (表行) 中的每个元素的开头找到。这使得每个行可见。

然后筛选方法应用到该列表中,这是循环调用该函数定义中的每个元素的元素的列表。请注意,this中的筛选器函数是指表行被测试,不是搜索字段。

如果该筛选器函数返回 true 的列表项上,该项目仍然在结果列表中,如果为 false,则被删除。这里,准备好的 RegExp 被应用,并与相匹配,则函数返回 false。因此筛选后有一个列表的元素/行的不匹配,并且最后应用.hide()即 jQuery 方法隐藏调用它的所有元素。因此,您可以隐藏不匹配的行。

该代码可能如下所示在"纯"的 javascript (它应该适合,我解决了问题 cjsmith 编写了有关在注释)。

var $rows = document.querySelectorAll("#table tr");
document.getElementById("search").addEventListener("keyup", function(e) {

  var val = '^(?=.*' + e.target.value.trim().split(/s+/).join(')(?=.*') + ').*$';
  var reg = RegExp(val, 'i');

  Array.prototype.forEach.call($rows, function(row) {
    var text = row.textContent.replace(/s+/g, ' ');
    row.style.display = reg.test(text) ? 'table-row' : 'none';
  });

});

PS.新年快乐 !

非常好,我只是必须要将显示行更改为 elem.style.display = reg.test(text)?表行: 无;

var $rows = $(#table tr');

它是中的作用,将在其中的目标在寻找匹配

pd︰ 这就是第一次我看到的 '$' 来声明变量和我已了解的它将其设置为 jquery 对象。.就是这一点。

是的 $rows 是目标,但实际上没有任何意义,这是 jquery 程序员方法符号 $。它的良好记忆 jquery 对象,"hımmm,这有 $ 开头,因此,必须为 jquery 对象"。

实际上var $rows = $('#table tr');var rows = $('#table tr'); -> 这些是相同,没有$rowsrows之间的差异.

-----------------------------------------------------------------------------------------

var val = ' ^ (? =。$.trim($(this).val()).split(/s + +).join (') (? =。) +)。 * $',reg = RegExp (val,i),

text; the '$.trim($(this).val()' is equal to $.trim($("#user_input").val()); .......right?

在 javascriptthis引用事件的负责人。示例您共享,this使用 keyup 回调函数$('#search')的所以,这意味着this引用$("#search").

-----------------------------------------------------------------------------------------

reg = RegExp (val,i) 注册表变量用作一个构造函数来查找匹配项,将不区分大小写,但它是不是应该 reg = 新的 RegExp (val,我也是可以设置的 ')' 或者我吗?

有很好的解释新关键字的 Javascript 中这个问题,您可以检查它。

-----------------------------------------------------------------------------------------

$rows.show().filter(function() {
        text = $(this).text().replace(/s+/g, ' ');
        return !reg.test(text);
}).hide();

我们来解释它的步骤

var $rows = $('#table tr');
  • $rows是一个 tr 对象的数组
  • $rows.show()意味着显示所有 tr 标签的 id 为 #table 的表中。
  • jQuery 是可链接,这就意味着$rows.show()返回$rows再次
  • 因此$rows.show().filter() = $rows.filter
  • 同样是$rows仍是 tr 对象的数组,因此喜欢$rows.filter()循环访问该对象的回调函数处理对$rows中的每个对象的 for 循环,.
  • 在回调函数中,这表示在此示例中的所有者在时筛选器就循环 $rows 在那时是对象的所有者。
  • 正如您所说test()将返回一个 bool 值。
  • !是反相器,

    !true = false

    !false = true

我非常喜欢它的时间,谢谢专家澄清这给我

我得转 !Guten 标记,nero !

我将回答您的问题从顶部到底部,并看到是否我们可以将其覆盖。首先,要了解行的变量是否正确。它是一个 jquery 对象,该对象包含与搜索字符串匹配的 DOM 对象的数组。在这种情况下,tr 的表中。

您已经获得的 #user_input 部分正确。keyup 函数内的 $(this) 是首先引发该事件的 DOM 对象的引用。在这种情况下,用户输入。

但它是不是应该 reg = 新的 RegExp (val,我也是可以设置的 ')' 或者我吗?

如果使用 new 关键字时,看起来更安全。为进一步引用,其,在这里看到︰ http://zeekat.nl/articles/constructors-considered-mildly-confusing.html这可能不是您依赖不仅仅是类的静态位的情况下有必要,但它是更好的安全比我想说对不起移动。

现在的难点︰

$rows.show().filter(function() {
        text = $(this).text().replace(/s+/g, ' ');
        return !reg.test(text);
}).hide();

$rows.show() 将使所有 DOM 对象行 jquery 对象中。

然后,它会转到筛选器意味着该对象的同一套将要减少基于返回布尔值的函数 var的行中的 DOM 对象。在这种情况下,该函数是︰

text = $(this).text().replace(/s+/g, ' ');
return !reg.test(text);

它将所有空白都替换为单个空格,,然后测试与正则表达式相匹配。因此,此处,如果它不传递正则表达式 (! = 逻辑非) 将一直留在一组。

最后-此函数将隐藏一切通过筛选器。

因此,它显示的所有内容,然后再隐藏什么不匹配正则表达式。

帮助的希望 !Habst ein guten neue Jahre (如何是我德语吗?)

内容来源于Stack Overflow 'Translation from Jquery to javascript'
请输入您的翻译

'Translation from Jquery to javascript'

确认取消