Sg2.9
Working With Text Ranges
Index RSS

When you change the style of typography in Illustrator by hand, you select a range of text with the type tool by clicking and dragging. You can think of text ranges in much the same way.

In the following example we create a text item by hand and select the first word and change its font to Helvetica.

If we would want to accomplish the same as was done above by hand (without selecting the text), we would do the following:

// Create the text item
var position = new Point(50, 50);
var textItem = new PointText(position);
textItem.content = 'This is a textrange';

// Get a TextRange of the first 5 characters
var subRange = textItem.range.getSubRange(0, 5);

// Change the font of the range's character style
subRange.characterStyle.font = app.fonts['Helvetica'];

Working With the Whole Range of a Text Item

textItem.range returns the whole range of the text item. So to change the font of all the text in the text item, you would do the following:

// Create the text item
var position = new Point(50, 50);
var textItem = new PointText(position);
textItem.content = 'This is a textrange';
textItem.range.characterStyle.font = app.fonts['Helvetica'];

Characters, Words and Paragraphs

Text ranges also offers access to characters (TextRange.characters), words (TextRange.words) and paragraphs (TextRange.paragraphs).

// get the first paragraph of the text item's text range:
var firstParagraph = textItem.range.paragraphs[0];

// get the second word of that paragraph:
var secondWord = firstParagraph.words[1];

// get the third character of that word:
var thirdCharacter = secondWord.characters[2];

Changing the Content of a Text Range

To change the text of a text range, you can access textRange.content, which is a string. For example, if we wanted to change the text of the first word of the text range, we could do the following:

// Create the text item
var position = new Point(50, 50);
var textItem = new PointText(position);
textItem.content = 'This is a textrange';

var firstWord = textItem.range.words[0];
firstWord.characterStyle.fillColor = '#ff0000';
firstWord.content = 'That ';

Working With Selected Text

To find a text range selected by the user we can access document.selectedTextRange. The following example grows the font size of the selected text by 5pt:

var range = document.selectedTextRange;
if (range) {
	range.characterStyle.fontSize += 5;
}

Helvarial

For a bit of comic relief, let's make a script that changes the font of all even letters of the selected text item to Helvetica and the odd letters to Arial:

var textItems = document.getItems({
	type: 'TextItem',
	selected: true
});

var arial = app.fonts['Arial'];
var helvetica = app.fonts['Helvetica']['Regular'];

if (textItems.length > 0) {
	var textItem = textItems[0];
	var characters = textItem.range.characters;
	for(var i = 0; i < characters.length; i++) {
		var character = characters[i];
		if (i.isOdd()) {
			character.characterStyle.font = arial;
		} else {
			character.characterStyle.font = helvetica;
		}
	}
}