Question

如何将第一个p变成红色？

我使用import React from 'react'; import { Platform } from 'react-native'; import { createStackNavigator, createBottomTabNavigator, createDrawerNavigator } from 'react-navigation'; import { Icon } from 'expo'; import { Ionicons} from '@expo/vector-icons'; import HomeScreen from '../screens/HomeScreen'; import CharacterScreen from '../screens/CharacterScreen'; import BackgroundDetails from '../screens/CharacterScreens/BackgroundDetails'; import RaceDetails from '../screens/CharacterScreens/RaceDetails'; import ClassDetails from '../screens/CharacterScreens/ClassDetails'; const RaceStack = createStackNavigator({ race: RaceDetails }); const ClassStack = createStackNavigator({ class: ClassDetails }); const BackgroundStack = createStackNavigator({ background: BackgroundDetails }); const GeneratorStack = createStackNavigator({ generator: CharacterScreen, }); GeneratorStack.navigationOptions= { tabBarLabel: 'Generator', tabBarIcon: ({focused}) => ( <Icon.Entypo focused={focused} name={'retweet'} size={26} /> ) } RaceStack.navigationOptions= { tabBarLabel: 'Race', tabBarIcon: ({focused}) => ( <Icon.MaterialIcons focused={focused} name={'person'} size={26} /> ) } ClassStack.navigationOptions= { tabBarLabel: 'Class', tabBarIcon: ({focused}) => ( <Icon.MaterialCommunityIcons focused={focused} name={'sword-cross'} size={26} /> ) } BackgroundStack.navigationOptions= { tabBarLabel: 'Background Story', tabBarIcon: ({focused}) => ( <Icon.Feather focused={focused} name={'book'} size={26} /> ) } export default createBottomTabNavigator({ GeneratorStack, ClassStack, RaceStack, BackgroundStack, });是因为我需要搜索所有的P。但是我只希望代码仅对第一个结果起作用，然后再“退出”或类似的操作。

我该如何使用jQuery？

PS：这是一个简单的示例，代码比这更复杂，所以请不要建议使用类似each()或CSS的方式...我需要使用运行每个方法的jQuery来做到这一点。

谢谢。

http://jsfiddle.net/ybr2qh46/

$('p').eq(0)

Answer 1

您可以return false来阻止循环继续到下一个元素：

(function($){
    $('p').each( function(){
    $(this).css( 'color', 'red');
    return false;
  });
})(jQuery)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>name 1</p>
<p>name 2</p>
<p>name 3</p>

另一个选择-如果您希望循环继续（但仍只希望更改第一个元素）-您可以检查该元素是否是第一个：

(function($){
    $('p').each( function(i) {
    if (i == 0) {
      $(this).css( 'color', 'red');
    }
  });
})(jQuery)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>name 1</p>
<p>name 2</p>
<p>name 3</p>

Answer 2

您可以尝试使用.first()方法。如果有一个或多个选择器，则用于选择第一个选择器。

$('p').first().css( 'color', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>name 1</p>
<p>name 2</p>
<p>name 3</p>

另一个选项（必须使用每种方法）：

var item = Array.from($('p').each(function (){}))[0];

$(item).css('color', 'red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>name 1</p>
<p>name 2</p>
<p>name 3</p>

运行each（），但仅应用于第一个结果

2 个答案: