Develop Reference

Javascript Regex to discard match in specific html tag and match others?

I need to match words in HTML but need to skip a tag (with specific class) and its contents.
Example:
<p> There is my way <span class="abc"> way beyond someone </span></p>
I need to match only first way word. Till now i am using word boundary to select word. /\b(way)\b/ig but it fails in below scenario.
<p> There is nothing. <span class="abc"> Way beyond someone </span></p>
In this statement i don;t want to match anything because way is inside the span.abc element.
I have tried ^ operator but doesn't seems to work. i.e. /(\b)way(\b)^("abc">the)/ig

I don't know a way to do what you want to, but you could use one regex for all the matches, use another regex for the ones you want to discard, and then use only the matches in one match and not the other.
In your example:
way
Matches all the times this word appears
<span.*?>(.|\n)*?way(.|\n)*?<\/span>
Matches all span elements.
Then you cant get all matches for first regex wich weren't matched by the second one.

i tried it in another method....
it returns the matched string without the word "Way"....
var str="<p> There is nothing. <span class=\"abc\"> Way beyond someone
</span></p>";
var x=str.split(" ")
//console.log(x);
for(var i=0;i<x.length;i++)
{
//console.log(x[i])
if(x[i]!="Way")
{
console.log(x[i])
}
}
hope it is helpful...

Find a word on a webpage and add a span to it

I've been trying to search for a word and add a span to it in order to give it some styling and functionality, and I've found a method of doing this, but it isn't very effective.
I have a content script that is searching for the word searching and then I replace the innerHTML with an added span to the keyword.
This is my JS file:
function getText(){
return document.body.innerText
}
if(getText().indexOf("searching") > -1) {
document.body.innerHTML = document.body.innerHTML.replace(new RegExp("searching", "g"),"<span class='spanDetected' id='spanDetected'>"+
'searching'+"</span>");
console.log("true");
}
And this is what the outcome is:
So it seems to work on some level, but then the problem arises that it also changes URLS and Textboxes, like so:
What is a better way of styling and adding functionality to a word?

Using Regex to parse [X]HTML is a terrible idea. Imagine the following HTML:
<div id="searching">A searching inspection</div>
Your program would replace both instances of the phrase 'searching', which is not what you want. You need to parse the page and replace the nodes intelligently. Perhaps ignore hyperlinks or use an overlay div for the hyperlink nodes
You have two options:
Traverse through all nodes recursively.
Use XPath to select the nodes that contain a specific text.
Something like this can get you all the nodes that contain the phrase 'searching'.
//text()[contains(., 'searching')]
Then you can loop through all the nodes and replace the one you want. Since you are developing a Chrome extension you can use $x to get the array of nodes that meet your XPath conditions:
$x("//text()[contains(., 'searching')]")
Read this answer to learn how you can loop through the items in the array.

jquery selection for starting with something and ending with something

I need to select the elements with id which starts with 'start-' and ends with 'end-' string. How to get this done using jquery selector? One line selector please?

Well that answer would select two types both thoose who end- without having start and the other way around the right answer would be this one
http://jsfiddle.net/XQBGs/
$('[id|="start"][id$="end-"]')

jquery selector problem

I'm trying to select a div with the id "about me". I think I am having problems because of the spaces.
alert($link.attr("title"));
I get "about me"
alert($('#'+$link.attr("title")).attr("title"));
I get undefined.
I have tried to use php and jquery methods for removing them but it doesn't work.
So how do I get around this?

You need to remove the spaces, IDs with spaces aren't valid, and you'll have all sorts of issues...just like this :)
You can escape it like this:
alert($('#'+$link.attr("title").replace(/ /g, "\\ ")).attr("title"));
But this is not the correct solution to the problem, removing the spaces is the correct approach.

In general, if you want to get an element by a variable ID it's better to do that via the plain DOM getElementById method than to try to shoehorn it into a selector with all the escaping issues that brings with it. eg:
$(document.getElementById($link.attr("title")))
However, for the particular case of the space character, it's invalid, period; as Nick says, you need to get rid of it. Whilst IDs are much more permissive in HTML5 than they were in HTML4 and XHTML1, even in HTML5 spaces are not allowed.

How can you use jQuery to do something to a certain string in the page text?

Is there a way to use jQuery to search a <p> and do something to each occurrence of a string.
For example make every string "magic" in the page bold?
Is there a way to do it for a character so that every 'a' could be made bold? It appears contains just gives the element that contains the text and not the string itself.

I think i'd use a combination of JQuery and JS regexps: JQ to find the elements to process and get the contents out of each, JavaScript's replace() method to do the string manipulation, and JQ to put the modified contents back in the DOM elements.
$('p').each(function(){
$(this).html($(this).html().replace(/(bold)/,'<b>$1</b>'));
});

http://www.jquery.info/spip.php?article50
this plugin will do the bolding example. If you need it to do something else, you can modify the plugin as needed.