Question

你好说我有以下html：

Phasellus sit amet auctor velit, ac egestas augue.

我想在span标签中包含最后一个单词，结果将是：

Phasellus sit amet auctor velit, ac egestas augue.

逻辑如下：

var paragraph = $("p");
var lastWord = /* target the last word */
lastWord.wrap("<span></span>");

谢谢！

Answer 1

我希望这段代码对你有帮助:)

＆＃13;

import boto3
client = boto3.client('ec2')

def lambda_handler(event, context):
    source_volume = event["detail"]["source"]
    source_volume_id = 'vol-' + source_volume.split('vol-', 1)[1]
    volume_detail = client.describe_volumes(
        VolumeIds=[
            source_volume_id,
        ]
    )

    instance = client.describe_instances(
        InstanceIds=[
            volume_detail['Volumes'][0]['Attachments'][0]['InstanceId']
        ]
    )
    for pair in instance['Reservations'][0]['Instances'][0]['Tags']:
        if pair['Key'] == 'Name' and pair['Value'] == 'my-tag':
            return pair

＆＃13;

Name

＆＃13;

jQuery(document).ready(function($){  
		
	$('p').html(function(){	
		// separate the text by spaces
		var text= $(this).text().split(' ');
		// drop the last word and store it in a variable
		var last = text.pop();
		// join the text back and if it has more than 1 word add the span tag
		// to the last word
		return text.join(" ") + (text.length > 0 ? ' <span class="last">'+last+'</span>' : last);   
	});

});

＆＃13;

Answer 2

我将这个问题分解为多个步骤，以便更容易理解必须做的事情 - 希望它有所帮助：

const paragraph = $('p');

let paragraphWords = $(paragraph).text().split(' ');

let lastWordIndex = paragraphWords.length - 1;
let lastWord = paragraphWords[lastWordIndex];
let lastWordModified = `<span>${lastWord}</span>`;

paragraphWords[lastWordIndex] = lastWordModified;

let newParagraphWords = paragraphWords.join(' ');

$(paragraph).html(newParagraphWords);

Answer 3

// target the string
const string = document.querySelector('.string');

// split the words of the string into an array
const wordsOfStringArray = string.innerHTML.split(' ');

// isolate the last word and remove from string
const lastWordOfString = wordsOfStringArray.pop();

// wrap the last word in a span tag to style independently
const newStringHTML = `
    ${wordsOfStringArray.join(' ')} <span class="last">${lastWordOfString}</span>
`;

// finally, replace the HTML with the new markup
string.innerHTML = newStringHTML;

.last {
    /* knock urself out */
    color: tomato;
    font-size: 2em;
}

<p class="string">Phasellus sit amet auctor velit, ac egestas augue.</p>

使用jQuery包装span标签中段落的最后一个单词

3 个答案: