Develop Reference

Loop through text for multiple instances of same string

I have a passage of text, which might have multiple of the same word in it. Whenever this word appears, I want to replace it with itself, but wrapped in a div so that I can apply styles and add some extra text.
I have got this working for the first instance of the word:
var definition = glossaryList[index].definition;
var termStart = textAsLower.search(termAsLower);
var termEnd = term.length + termStart;
var replacedText = addDefinitionToText(textContent, term, definition, termStart, termEnd);
function addDefinitionToText(textContent, term, definition, termStart, termEnd) {
var textStart = textContent.substring(0, termStart);
var termInText = textContent.substring(termStart, termEnd);
var textEnd = textContent.substring(termEnd);
var replacedTerm = '<span class="has-definition">' + termInText;
replacedTerm += '<div class="attached-definition">';
replacedTerm += '<div class="defintion-title">' + term + '</div>';
replacedTerm += '<div class="definition-text">' + definition + '</div>';
replacedTerm += '</div>';
replacedTerm += '</span>';
return textStart + replacedTerm + textEnd;
}
I've tried putting this function into a while loop and counting up, but it is causing me issues and freezing or not returning what I am expecting:
while(something.toLowerCase().search(termAsLower)) {
var something = textAsLower.substring(termEnd);
termStart = something.search(termAsLower);
termEnd = term.length + termStart;
replacedText = addDefinitionToText(something, term, definition, termStart, termEnd);
something = replacedText.substring(termEnd);
}
Does anyone have a solution to this? Ideally I would actually like a different method to .search(), which finds all instances not just the first, but my searches haven't been too fruitful.
Thanks!

You can simply use regex to achieve what you want:
var searchWord = "tag";
var textStr = "HTML tag is used for scripting. Tag can also be self-closing.";
// case-insensitive regex
var re = new RegExp(searchWord, "gi");
textStr = textStr.replace(re, '<' + searchWord + '>');
// case-sensitive search
var re = new RegExp(searchWord, "g");
textStr = textStr.replace(re, '<' + searchWord + '>');

I did something like this before. I split the text by spaces and put that array into foreach and edit. Here's an exapmle code
if(text.includes("http")){
var returnString = '';
text.split(" ").forEach(function(link) {
if(link.includes("http")){
returnString += '<a target="_blank" style="color:white" href="' + link + '">here</a> ';
}else{
returnString += link + " ";
}
});
text = returnString;

A regular expression with the String replace method can solve this fairly easily.
This function will return a new string with the word and definition wrapped.
I have used a template literal to make things a bit cleaner but they are unsupported in IE.
function wrapWordWithDefinition(sentance, word, definition) {
var template = `<div>
<div class="attached-definition">
<div class="defintion-title">${word}</div>
<div class="definition-text">${definition}</div>
</div>
</div>`;
// global and case insensitive
var re = new RegExp(word, 'gi');
return sentance.replace(re, template);
}
var sentance = "This will replace word, when word is encountered";
var myword = "word";
var definition = "The definition of the word";
var result = wrapWordWithDefinition(sentance, myword, definition);
console.log(result)
For further reading on regular expressions: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp

Wrap each word in string with span using regular exp

how to replace each word in text with "span" using regular exp?
var text = "1:393 1:838 3:936 1:998 1:1398 1:1652 1:1718 1:1806"
final op = "<span class="word">1:393</span><span class="word">1:838</span><span class="word">3:936</span><span class="word">1:998</span><span class="word">1:139</span>...."

You don't really need a regex for that if the separator is always a single space, just split on the space (or \b if you want a regex), add some markup, and join back together again.
var text = "1:393 1:838 3:936 1:998 1:1398 1:1652 1:1718 1:1806";
var op = text.split(' ').map(function(w) {
return '<span class="word">' + w + '------</span>';
}).join('');
document.body.innerHTML = op;
.word {color : red}

var op = '<span class="word">' + text.split(' ').join('</span><span class="word">') + '</span>'

Using String#replace.
const text = "1:393 1:838 3:936 1:998 1:1398 1:1652 1:1718 1:1806";
const result = text.replace(/\d:\d+/g, '<span class="word">$&</span>');
console.log(result);

This is what you need (https://jsfiddle.net/6r005vgf/3/):
var text = "1:393 1:838 3:936 1:998 1:1398 1:1652 1:1718 1:1806";
//var final = "<span class='word'>1:393</span><span class='word'>1:838</span><span class='word'>3:936</span><span class='word'>1:998</span><span class='word'>1:139</span>....";
var final_test = "<span class='word'>" + text.replace(/\s+/g, "</span><span class='word'>") + "</span>";
//alert(final);
alert(final_test);

Replace a few different elements in the string and return it

I have a string and I want change some words.
I write next function. If a word to change is alone in my string, this work normal. But if that words more then one it change only last.
<div class="container">
<div id="main-arr">How are you my friend?</div>
<div id="main-arr__last"></div>
</div>
$(document).ready(function() {
var sometext = $('#main-arr').text();
var someArr = sometext.split(' ');
for ( var i = 0; i < someArr.length; i++ ) {
if ( someArr[i] === 'you' || someArr[i] === 'he' || someArr[i] === 'she' ) {
var newArr1 = someArr.slice(0, i);
var newArr2 = someArr.slice(i + 1, someArr.length);
newArr1 = newArr1.join(' ');
newArr2 = newArr2.join(' ');
var word = 'error!';
console.log(newArr1);
console.log(newArr2);
$('#main-arr__last').html(newArr1 + '<span class="red">' + ' ' + word + ' ' + '</span>' + newArr2);
}
}
});

The function is not changing only the last word. The problem is that every time you replace a word you replace the html in #main-arr__last too.
Here is a better solution:
$(document).ready(function() {
var sometext = $('#main-arr').text();
sometext = replaceAll(sometext, ' you ', ' error! ');
sometext = replaceAll(sometext, ' he ', ' error! ');
sometext = replaceAll(sometext, ' she ', ' error! ');
var someHtml = toHtml(sometext, 'red');
$('#main-arr__last').html(someHtml);
});
function replaceAll(str, search, replacement){
return str.replace(new RegExp(search, 'g'), replacement);
}
function toHtml(str, clazz){
return replaceAll(str, 'error!', '<span class="' + clazz + '">error!</span>');
}
First we implement a function replaceAll to replace all occurrence of a word in a text, after that we have the text with all the words, you, he and she, in our case, replaced by error!.
Then we implemented the function toHtml to involve all 'error!' word in a span with a determined class passed as a parameter.

javascript line break is not applying when i use document.execCommand("copy")

Hi i'm using below code to build a string and copying it,but in output when i paste it the line break is not applying
function copyToClipboardShipto() {
var $temp = $("<input>");
$("body").append($temp);
var str1 = "#(Model.firstName)"; var str2 = " "; var str3 = "#(Model.lastName)"; var str4 = "\n";
var str5 = "#(Model.shiptoes[0].address.address1)";
var str6 = ",";
var str7 = "#(Model.shiptoes[0].address.address2)";
var str8 = "\n";
var str9 = "#(Model.shiptoes[0].address.city)"; var str10 = ","; var str11 = "#(Model.shiptoes[0].address.state)"; var str12 = "\n";
var str13 = "#(Model.shiptoes[0].address.zip)";
var str = str1 + str2 + str3 + str4 + str5 + str6 + str7 + str8 + str9 + str10 + str11 + str12 + str13;
$temp.val(str).select();
document.execCommand("copy");
$temp.remove();
}
}
firstname lastname223 E JACKSON AVE,city,statezip
any help appericiated

Use <textarea> instead of <input>, since INPUT doesn't support multiline strings.
var $temp = $("<textarea>");

Use <textarea> instead as <input> wont support line breaks.

Add .html to a string Javascript?

I want to check if a string is ending with ".php" extension, if not I want to add .html at the end. I have already tried various "slice" methods without success.

You can use Regex for that
var string1 = "www.example.com/index";
var newString = !/\.php$/i.test(string1)? string1+".html": string1;
// newString = "www.example.com/index.html"

Use (yourstring + '.html').replace(/\.php\.html$/, '.php') to do that:
var str1 = 'one.php';
var str2 = 'two';
var str3 = '.php.three.php';
var str4 = '.php.hey';
console.log((str1 + '.html').replace(/\.php\.html$/, '.php')); // Prints one.php
console.log((str2 + '.html').replace(/\.php\.html$/, '.php')); // Prints two.html
console.log((str3 + '.html').replace(/\.php\.html$/, '.php')); // Prints .php.three.php
console.log((str4 + '.html').replace(/\.php\.html$/, '.php')); // Prints .php.hey.html

Or perhaps:
function appendHTML(string) {
var html = string;
if (string.lastIndexOf('.php') === (string.length - 4)) {
html += '.html';
}
return html;
}

Well, slice() works ok for this task.
var s = "myfile.php";
if (s.slice(-4) != ".php")
s = s.slice(0, -4) + ".html";

Use regular expression to solve your problem.
/.php$/ is a regular expression that checks to see if a string ends with '.php'
For more information read: http://www.w3schools.com/js/js_obj_regexp.asp
Example Code:
str = "http://abc.com";
str = ( /\.php$/.test( str ) ) ? str : str + '.html'; // this is the line you want.
str === "http://abc.com.html" // returns true

Try something like this
function isPHP(str)
{
return str.substring(str.length - 4) == ".php";
}
Then you could do
str = isPHP(str) ? str : str + ".html";