Question

我最近一直在浏览一个jQuery教程，那个人轻松过度我并不理解的东西......脚本和标记是：

＆＃13;

  $("document").ready(function() {
      $("#example p").replaceWith(replacementFn);
  });

  function replacementFn() {
      if ($(this).text().indexOf("1") != -1) {
          return "<p>This is paragraph uno</p>";
      }
      else {
          return this.outerHTML;
      }
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="example">
    <p class="a">This is paragraph 1</p>
    <p id="para1">This is paragraph 2</p>
    <p class="b">This is paragraph 3</p>
    <p id="para4" lang="en-us">This is paragraph 4</p>
    <p id="para5" lang="en-gb">This is paragraph 5</p>
</div>

＆＃13;

我不明白这里的事情是＆（39）if（$（this）.text（）。indexOf（＆＃34; 1＆＃34;）！= -1＆＃39背后的逻辑我知道！=表示＆＃39;不等于＆＃39;并且我们在每个p元素中查找数字＆＃39; 1我想我不会理解-1在这里的含义以及为什么它使语句成立。

教程中的那个人只是说“让我们找一个字符串＆＃34;一个＆＃34;”，并且它不等于一个，这意味着它被发现＆＃39 ;然后继续前进。

我确信这对程序员来说非常明显，但我更多的是前端开发人员试图获得一些jQuery和Javascript的基础知识。任何对相关门外汉有意义的解释都将不胜感激！

Answer 1

在$(this).text().indexOf("1") -

$(this)是jQuery的选择器
.text() jQuery函数从选择中选择文本（不是html）（第1点）
.indexOf("1") JavaScript核心函数在所选文本中找到1的位置（第2点）[1在第一段中出现]（如果indexOf("Find_What")找不到我们要求的内容，它返回-1。

基本上indexOf返回字符串中匹配的索引，它可能是0,1 ...

例如 -

"1st paragraph".indexOf("1");

IndexOf（＆＃34; 1＆＃34;）将返回0，因为它位于第一个位置。

"paragraph 1".indexOf("1") 在这种情况下，它将返回13。

所以-1确实存在缺少＆＃34; 1＆＃34; （匹配）在字符串中。

PS- indexOf也是更快，更首选的功能，可以在JavaScript中搜索字符串中的内容。

Here你可以解渴，更多地了解＆＃39; indexOf＆＃39;。

Answer 2

if ($(this).text().indexOf("1") != -1)

如果作为参数提供的字符串不包含在搜索的字符串中，则JavaScript indexOf()返回-1，否则搜索字符串在搜索字符串中的位置。

与大多数语言一样，JavaScript使用从零开始的索引，因此返回值0意味着“1”出现在搜索字符串的最开头。

Answer 3

indexOf（）函数返回字符串中首先发生搜索的子字符串的位置，如果不发生子字符串则返回-1。

在此示例中，text().indexOf("1")返回首次出现1的位置。如果1不存在，则indexOf（）返回-1。

Answer 4

函数replacementFn将检查$(this).text()（称为元素文本）是否包含“1”.indexOf("1")，如果是，则返回"This is paragraph uno"

当indexOf()值等于-1时，这意味着它找不到匹配项，因此我们希望它不等于-1又名!= -1

然后jQuery的.replaceWith()将使用返回的字符串来替换匹配元素的文本。

Answer 5

indexOf返回“1”存在的位置。 indexOf（“1”）将在'T0'，'h1'，'i2'，'s3'，'4'，'i5'，'s6'，'7'，'p8'，'a9'中返回18， 'r10'，'a11'，'g12'，'r13'，'a14'，'p15'，'h16'，'17'，'118' 而对于其他字符串，它将返回-1，因为这些字符串中不存在1

Answer 6

让我们整个解决这个代码段，以便您更好地了解它。

您可以看到有$(document).ready()调用 - 这会检查整个页面是否已加载，如果已加载，则执行作为参数传递的函数。

该函数包括搜索DOM节点（您现在可以将它们理解为HTML元素，但它有点复杂），可由#example p选择器描述 - 基本上，这意味着{{ 1}}调用将返回ID为$('#example p')的元素中包含的所有元素。

后来，有一个链式方法调用 - .replaceWith()，它将一个函数作为参数。这个链式方法调用的作用是将它所调用的元素的内容替换为作为参数传递给它的内容。在这种情况下，它就是我们的参数函数返回的内容。

example函数使用.text()方法搜索传递为replacementFn的上述DOM节点的内容（.indexOf()），该方法搜索调用它的字符串作为参数传递给它的字符序列，如果未找到序列，则返回$(this)或者大于-1的整数，但不大于它所调用的字符串的长度，如果序列找到 - 在这种情况下，返回的数字是字符串的索引，所寻找的序列从该索引开始。

回到-1 - 它搜索它传递的DOM节点的文本内容，如果它包含字符replacementFn（{0}返回的值大于{{} 1}}），它将节点的内容更改为1。

如果节点不包含.indexOf()字符（即返回-1方法This is paragraph uno），则通过返回其当前内容使节点保持原样，以便1方法无效。

我希望你现在得到它 - 如果你不清楚某些事情，请通过评论告诉我。

jQuery Beginner - 解释这个if语句的逻辑吗？

6 个答案: