Script to Populate <title> and <alt>

by **sagreiss** on Mon Mar 16, 2009 7:00 am

I need two scripts.

1. To populate the <title> tag of html files with the text from the first instance of <h1>, if any, then <h2>, if any, then <h3>.

2. To populate the <alt> tag of images with the image's filename. It should also:
a. omit extension,
b. replace underscore with space character,
c. convert to Title Case.

Can anyone help?

by **rangana** on Mon Mar 16, 2009 11:36 am

Could you please show us your attempt.

by **sagreiss** on Mon Mar 16, 2009 5:22 pm

This lovely little line of code works, but the "newTitle" element needs to be inserted manually, which sucks.

<body onload='javascript: document.title = document.getElementById("newTitle").innerHTML;'>

Someone has suggested amending it with the following, but the code is not written in inline format, and some of the syntax is not quite the same, so I can't make it work, and it doesn't provide for the absence of an instance of h1, i.e. proceed to h2, then h3:

function updateTitle() {
var title = document.getElementsByTagName("H1")[0];
if (title) document.title = title.innerHTML;
}

This script works reasonably well for the <alt> image tags:

<script>
function writealt()
{
for (pic = 0; pic<document.images.length; pic++)
{
document.images[pic].alt = document.images[pic].src
}
}
</script>
</head>
<body onload="writealt();">

For some reason it seems to be picking up path with filename. I've tried everything I can think of, adding to or replacing src with various elements such as file, filename etc. Nothing seems to work.

Eliminating extension, replacing underscore by a space character, and converting to title case would be perfect.

I apologize if these questions are dumb, but I am not a programmer.

by **rangana** on Tue Mar 17, 2009 3:02 am

Use this one instead:

Code: Select all: <script type="text/javascript"> /** Script Created as part of forum request: http://www.devppl.com/forum/script-to-populate-title-and-alt-vt13075.html Created by Raymond Angana a.k.a rangana in devppl.com/forum Date Created: 3/17/09 This notice must stay intact for legal use */ window.addEventListener?window.addEventListener('load',function () { ray.customScript('h1','h2','h3'); // Finds first instance of these tags and change's the nodes to that of the title },false): window.attachEvent('onload',function () { ray.customScript('h1','h2','h3'); // Finds first instance of these tags and change's the nodes to that of the title }); // FF : IE var ray = { customScript:function () { var elArr = this.customScript.arguments; var imgs = document.getElementsByTagName('img'); for ( var i = 0 ; i < elArr.length; i++ ) document.getElementsByTagName(elArr[i])[0].firstChild.nodeValue=this.getTitle(); for (var c = 0 ; c <imgs.length; c++) imgs[c].setAttribute('alt',this.clean(imgs[c].src)); }, getTitle:function () { return document.getElementsByTagName('title')[0].firstChild.nodeValue; }, clean:function (img) { var imgs = img.split('/'); return imgs[imgs.length-1].replace(/\.([a-z]){3}/gi,'').replace(/_/g,' '); } } </script>

by **sagreiss** on Tue Mar 17, 2009 6:33 am

Thanks, man, but I can't seem to get it to work for either purpose, page title or image alt, neither in SeaMonkey nor in IE. Is there a <body onload> even I'm forgetting? (I can't seem to attach my test file, neither as HTML nor as TXET.

by **rangana** on Tue Mar 17, 2009 6:38 am

That script should work as is. There's no customization needed.

Could you please provide a link to your page where you applied this script.

by **sagreiss** on Tue Mar 17, 2009 6:40 am

OK, attached is the IE error message in JPG.

by **sagreiss** on Tue Mar 17, 2009 6:44 am

http://www.sagreiss.org/test_file.htm

by **rangana** on Tue Mar 17, 2009 6:55 am

Your title tag don't have any text nodes. It's empty:

Code: Select all: <title></title>

The code is expecting that there should be a text node for the title tag.

by **sagreiss** on Tue Mar 17, 2009 6:59 am

OK, thanks. That works for the title. I added an image alt based on the same logic, but it still doesn't seem to pick up the filename.

Script to Populate <title> and <alt>

Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Re: Script to Populate <title> and <alt>

Who is online