Hello,
I've got a number of html fragments (in a template file) which are bundled
together in a cms.
I'm sure that there's a way through javascript to convert a piece of code
like this:
<!-- START BE_sectionNew-htmlarea2.tpl -->
to a clickable link like:
<a href="admin/editTemplate.ph p?file=BE_secti onNew-htmlarea2.tpl"> <img
src="/image/template.png"></a>
I'm just not a javascript guy and am not sure how to apply a regular
expression and rewrite the page output in javascript.
Any suggestions?
My ultimate goal is to put some way to easily mark and/or edit the
beginning/end of each of the template files which is used to make up a
page to make it easier for folks to edit it.
Mike 8  1939 
"Mike Gifford" <mi**@openconce pt.ca> writes: I'm sure that there's a way through javascript to convert a piece of code
like this:
<!-- START BE_sectionNew-htmlarea2.tpl -->
to a clickable link like:
<a href="admin/editTemplate.ph p?file=BE_secti onNew-htmlarea2.tpl"> <img
src="/image/template.png"></a>
That depends on whether you want to do it in a live page or just in a
piece of text.
If you have it as text, you can do:
someText.replac e(
/<[!]-- START ([^\s]*) -->/g ,
"<a href=\"admin/editTemplate.ph p?file=$1\"><im g "+
"src=\"/image/template.png\"> <\/a>");
If you want to do it on the current page, you can't do it consistently
across browsers. For one, I don't think it is possible in IE.
You don't have access to the source HTML text of the active page, only
the parsed document tree structure. IE doesn't retain comments in that
tree, while, e.g., Mozilla does.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleD OM.html>
'Faith without judgement merely degrades the spirit divine.'
Hello Lasse,
On Mon, 22 Dec 2003 14:02:20 +0100, Lasse Reichstein Nielsen wrote: "Mike Gifford" <mi**@openconce pt.ca> writes:
I'm sure that there's a way through javascript to convert a piece of
code like this:
<!-- START BE_sectionNew-htmlarea2.tpl -->
to a clickable link like:
<a href="admin/editTemplate.ph p?file=BE_secti onNew-htmlarea2.tpl"> <img
src="/image/template.png"></a>
That depends on whether you want to do it in a live page or just in a
piece of text.
I want to do it on a live page. I'd like to be able to replace all
text/html exported to the browser. Should go from the <body> to </body>.
If you have it as text, you can do:
someText.replac e(
/<[!]-- START ([^\s]*) -->/g ,
"<a href=\"admin/editTemplate.ph p?file=$1\"><im g "+
"src=\"/image/template.png\"> <\/a>");
If you want to do it on the current page, you can't do it consistently
across browsers. For one, I don't think it is possible in IE.
I'm a Linux user, so getting it working in Mozilla is just fine. Getting
it working in IE is a perc, but why give just one more reason for folks to
use the better browser?
On my box I'm using Mozilla 1.6a
You don't have access to the source HTML text of the active page, only
the parsed document tree structure. IE doesn't retain comments in that
tree, while, e.g., Mozilla does.
Ok.. So how would I access the document tree?
My current test page is:
<html>
<head>
<title>Replac e</title>
<script language="JavaS cript">
<!--
// Lasse's Example:
// someText.replac e(
// /<[!]-- START ([^\s]*) -->/g ,
// "<a href=\"admin/editTemplate.ph p?file=$1\"><im g "+ //
"src=\"/image/template.png\"> <\/a>");
function replaceTextFunc tion() {
var text = document.getEle mentById("BE_AL L");
document.getEle mentById("BE_AL L").innerHTM L =
text.replace(/<[!]-- START ([^\s]*) -->/g , "<a
href=\"admin/editTemplate.ph p?file=$1\">Edi t Template<\/a>");
}
}
-->
</script>
</head>
<body ID="BE_ALL">
<form>
<input name="form1" value="replaceT ext" type="submit"
ONCLICK="replac eTextFunction() "/> <br> <textarea name="textarea1 " rows="2"
cols="50"> <!-- START BE_articlenew-htmlarea2.tpl --> <!-- START
BE_sectionNew.t pl --> </textarea>
</form>
<!-- START BE_articlenew-htmlarea2.tpl --> <!-- START BE_sectionNew.t pl
-->
</body>
</html>
The javascript console error that pops up is:
Error: text.replace is not a function Source File: http://localhost/replace.html?form1=...area1=%3C%21--
+START+BE_artic lenew-htmlarea2.tpl+--%3E%0D%0A%3C%21--+START+BE_secti onNew.tpl+--%3E%0D%0A
Line: 18
I've been playing around with this for a while now and either get that the
document has no properties or that replace isn't a function.
I can't see why it isn't a function, but......
Any additional help would be appreciated..
Mike
"Mike Gifford" <mi**@openconce pt.ca> wrote in message
news:pa******** *************** *****@openconce pt.ca...
<snip> function replaceTextFunc tion() {
var text = document.getEle mentById("BE_AL L");
Here you assign a reference to a DOM element to the - text - variable,
not a string.
document.getEle mentById("BE_AL L").innerHTM L =
text.replace(/<[!]-- START ([^\s]*) -->/g , "<a
And here you invoke a replace method on the object referenced by the -
text - variable. It doesn't have any such method so you get an error.
href=\"admin/editTemplate.ph p?file=$1\">Edi t Template<\/a>");
<snip>
The balance of probability is that you want to assign the value of the
innerHTML property of the DOM element to the - text - variable. Though
that would still only make invoking a replace method on that string
possible if the browser in question managed to successfully to retrieve
the DOM element and reading the innerHTML property returned a string,
rather than undefined, as would be the case on some browsers. (by which
I mean: your code should be doing a lot more checking to see if what it
is attempting can be achieved on the browser in use and, if so, how
successful the attempt is proving)
Richard.
"Mike Gifford" <mi**@openconce pt.ca> writes: I'm a Linux user, so getting it working in Mozilla is just fine. Getting
it working in IE is a perc, but why give just one more reason for folks to
use the better browser?
On my box I'm using Mozilla 1.6a
You don't have access to the source HTML text of the active page, only
the parsed document tree structure. IE doesn't retain comments in that
tree, while, e.g., Mozilla does.
Ok.. So how would I access the document tree?
That would require understanding the W3C Document Object Model (DOM).
It is a tree structure, and you just traverse it and convert the
comments you meet. You can see some example code here:
<URL:http://www.infimum.dk/privat/commentConverte r.html>
You also need to know how to build new DOM nodes using
document.create Element.
Using innerHTML, as you do, is not as safe. Instead of just removing
the comments and replacing them with new code, you rewrite the entire
document body. If you have event handlers assigned to some of the
nodes, they won't survive the rewrite. If it works, great, but just be
aware that you are creating an entirely new page, and not eveything
about the document is captured by innerHTML.
function replaceTextFunc tion() {
var text = document.getEle mentById("BE_AL L");
If you chose to use innerHTML, this line should be:
var text = document.body.i nnerHTML;
Then "text" actually contains text (no need for getElementById, the
body element is directly accessible in modern browsers).
document.getEle mentById("BE_AL L").innerHTM L =
text.replace(/<[!]-- START ([^\s]*) -->/g , "<a
href=\"admin/editTemplate.ph p?file=$1\">Edi t Template<\/a>");
I assume the linebreak was inserted by your news client. There shouldn't
be linebreaks inside Javascript strings.
Error: text.replace is not a function
Yes, "text" was not a string, so it had no "replace" method.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleD OM.html>
'Faith without judgement merely degrades the spirit divine.'
Hi Richard,
This was what I finally needed to make the script work. The balance of probability is that you want to assign the value of the
innerHTML property of the DOM element to the - text - variable. Though
that would still only make invoking a replace method on that string
possible if the browser in question managed to successfully to retrieve
the DOM element and reading the innerHTML property returned a string,
rather than undefined, as would be the case on some browsers. (by which
I mean: your code should be doing a lot more checking to see if what it
is attempting can be achieved on the browser in use and, if so, how
successful the attempt is proving)
I believe I've added sufficient checking for the browser's capacity, but
I'm not a javascript guy so feel free to correct me.
The code that's working for me in Mozilla is:
<html>
<head>
<title>Replac e</title>
</head>
<body ID="BE_ALL">
<script language="JavaS cript">
<!--
// Thanks for help from comp.lang.javas cript users function
replaceTextFunc tion() {
if (document.getEl ementById) {
var text = document.getEle mentById("BE_AL L").innerHTM L;
document.getEle mentById("BE_AL L").innerHTM L =
text.replace(/<[!]-- START ([^\s]*) -->/g , "<a
href=\"admin/editTemplate.ph p?file=$1\">Edi t Template<\/a>");
}
}
}
-->
</script>
<form>
<input name="form1" value="replaceT ext" type="submit"
ONCLICK="replac eTextFunction() "/> </form>
</body>
</html>
Hello Lasse,
On Mon, 22 Dec 2003 20:53:48 +0100, Lasse Reichstein Nielsen wrote: You don't have access to the source HTML text of the active page, only
the parsed document tree structure. IE doesn't retain comments in that
tree, while, e.g., Mozilla does. Ok.. So how would I access the document tree?
That would require understanding the W3C Document Object Model (DOM).
It is a tree structure, and you just traverse it and convert the
comments you meet. You can see some example code here:
<URL:http://www.infimum.dk/privat/commentConverte r.html>
Your script does seem to work better on the files I'm trying to work with.
You also need to know how to build new DOM nodes using
document.create Element.
I think I understand what this is doing while looking at the code....
Using innerHTML, as you do, is not as safe. Instead of just removing
the comments and replacing them with new code, you rewrite the entire
document body. If you have event handlers assigned to some of the
nodes, they won't survive the rewrite. If it works, great, but just be
aware that you are creating an entirely new page, and not eveything
about the document is captured by innerHTML.
I'd prefer to use your code (and give you credits inline). It's for a GPL
project though and need to get your permission to do so. If you have no
objections, great! The project is http://www.back-end.org and we have
quite a few templates which we use...
It works really nicely within a block since all of the javascript can be
defined within the body tags aswell! function replaceTextFunc tion() {
var text = document.getEle mentById("BE_AL L");
If you chose to use innerHTML, this line should be:
var text = document.body.i nnerHTML;
Then "text" actually contains text (no need for getElementById, the
body element is directly accessible in modern browsers).
document.getEle mentById("BE_AL L").innerHTM L =
text.replace(/<[!]-- START ([^\s]*) -->/g , "<a
href=\"admin/editTemplate.ph p?file=$1\">Edi t Template<\/a>");
I assume the linebreak was inserted by your news client. There shouldn't
be linebreaks inside Javascript strings.
I added that for the message. Error: text.replace is not a function
Yes, "text" was not a string, so it had no "replace" method.
Ok..
Mike
"Mike Gifford" <mi**@openconce pt.ca> writes:
[DOM node creation] I think I understand what this is doing while looking at the code....
Yeah, it's not deep. It's just not as direct as writing HTML, which
can be both good and bad. It's definitly more verbose :)
I'd prefer to use your code (and give you credits inline). It's for a GPL
project though and need to get your permission to do so. If you have no
objections, great!
No objections. Bear in mind that it took almost ten minutes to write, so
ofcourse there are no guarantees for anything :)
Good luck.
/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleD OM.html>
'Faith without judgement merely degrades the spirit divine.'
Hello Lasse,
On Mon, 22 Dec 2003 23:15:41 +0100, Lasse Reichstein Nielsen wrote: "Mike Gifford" <mi**@openconce pt.ca> writes: [DOM node creation] I think I understand what this is doing while looking at the code....
Yeah, it's not deep. It's just not as direct as writing HTML, which can
be both good and bad. It's definitly more verbose :)
I've got enough experience with PHP, but there is just a different set of
assumptions with javascript that I haven't got my head around yet.. I'd prefer to use your code (and give you credits inline). It's for a
GPL project though and need to get your permission to do so. If you
have no objections, great!
No objections. Bear in mind that it took almost ten minutes to write, so
ofcourse there are no guarantees for anything :)
A much appreciated 10 minutes.. I'll credit the code with something like:
Code Contributed by Lasse Nielsen - http://www.infimum.dk
I might ask for a limited guarantee or documentation if I was paying you
for this code. As it is, thanks a lot and Merry Christmas!
Mike This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics | |
by: worzel |
last post by:
Hi All,
I am looking for a reg ex that will match email addresses withing <a
href=mailto blah > links.
Actually, I already crafted my own, but with a slight problem:
<a href="mailto:fred@blah.com"> emal me</a> woud be matched as expected, but
so will:
|
by: H |
last post by:
This is kind of an followup on oneof my previous questions, and it has with
RegEx to do.
I have a string containing of several words. What would a good regex
expression looklike to get one match on every word ?
For example :
String myString =" This is the string that stupid H can't split up";
// A good RegEx needed here .. So the result would look something like this
;
|
by: JS |
last post by:
I am writing a C# app that needs to parse a sentence entered by the user
for a simple boolean search.
I need to capture all of the AND words that are not inside of double
quotes. However, I am having a heck of a time figuring out a regex for it.
Can anyone assist with a regex to find all the AND's not in double quotes?
An example sentence might be:
red and blue and "crazy elephant" and "orange and red" and stuff.
|
by: henrik |
last post by:
Hi
I have a regex question. I want to find all content of a <td
class="someclass"> tag. This means the expression should include all other
tags included between <td class="someclass"> and </td>.
Please help
Regards
|
by: Vai2000 |
last post by:
Can someone help me with expression needed to extract the entire string
FOO*1*DATA*DATA*ID~
1. This string pattern is embedded in a super long string..
TIA
This is my unsuccessful attempt
Regex re = new Regex("");
| | |
by: TheSteph |
last post by:
Hi,
I'm new to Regex..
Could someone show me how I can extract substring enclosed in ?
Example :
|
by: MCH |
last post by:
hi there,
I am working with a HTML-like text with boost:regex. For example,
the following pattern might occur in my text
<abc efg>
<p>EFG</p 12<3>
In this case, I would like to extract everything between
and replace with <pre>, with </pre>. Meanwhile,
everything outside should be unchaged except that < is
|
by: PaulM |
last post by:
...all but the first x chars in a string of arbitrary length?
Apologies if this is the wrong forum; I wasn't sure the best place to post about Regex.
Background: I am new to Regex for pattern matching.
I have started using Yahoo Pipes to manipulate RSS feeds. Yahoo Pipes includes a regex gadget to do string manipulation, but no "stateful" programming.
My goal is to truncate a string of arbitrary length to a fixed length (of, say, the...
|
by: =?Utf-8?B?bWFnZ2ll?= |
last post by:
hi,
I need some help with a reg. expression. I have a comma delimited file with
quotes. Not every field has quotes, only some. This is a sample of my file:
99,"01/01/2007","23,000",1,34,"henry",132,"45.00"
I used some code from an article that I though would do what I needed, but
it splits my amount fields(76,000 into two different fields : 76, and 000...
Do I change my pattern ? I never used regex before and need some help. thank
you.
|
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it.
First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
| | |
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own....
Now, this would greatly impact the work of software developers. The idea...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
| | |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...
| |
