So, Im curious if its possible to search an array and than put the result in a variable. I think my wording may be off, but here is an example:
Lets say Im trying to pass things through an <a> tag. Lets say I have this:
HTML Code:
<a href="#" rel="width:100|height:200|name:test">
Here's a rough JS:
Code:
var link = document.getElementsByTagName('a');
for (var i=0; i<link.length; i++) {
getSettings(this.rel);
}
function getSettings(link) {
var options = link.split('|'),
width = '',
height = '',
name = '';
*SEE BELOW
}
Now without doing options[0], options[1] and etc... is there a way to search all of them?
So do something like if any of the options contains width: set the variable named width with that option so... the variable width would equal width:100, and etc... And then do something that says if it doesnt have width set a width, so width = 100 (default value)
Currently I just did the options[0], options[1] and etc.. technique and used the match function and just checked each one.
Any ideas? Because doing it the way I did it seems very simple and repetitive.
we are declaring an array containing the attributes which are to be matched,
then passing parameter to the getSettings() function, there we checking whether the any of the attribute exisits or not.
Code:
<html>
<head>
<title></title>
<script type="text/javascript">
var attributes=new Array("width","height","name");
var finalresult="";
function test()
{
var link = document.getElementsByTagName('a');
for (var i=0; i<link.length; i++) {
getSettings(link[i].rel);
}
}
function getSettings(val) {
for(var i=0;i<attributes.length;i++)
{
var matchedIndex=val.indexOf(attributes[i]);
if(matchedIndex>=0)
{
val=val.substring(attributes[i].length+1,val.length);
var seperatorIndex=val.indexOf('|');
if(seperatorIndex!=-1)
{
var attributeValue=val.substring(matchedIndex,seperatorIndex);
}
else
{
var attributeValue=val.substring(matchedIndex,val.length+1);
}
val=val.substring(seperatorIndex);;
finalresult=finalresult+attributes[i]+" is "+attributeValue.toString()+"\n";
}
}
alert(finalresult);
}
</script>
</head>
<body>
<a href="#" rel="width:100|height:200|name:test">
<input type="button" value="Click" onclick="test()"/>
</body>
</html>
if thats the case , then i need to work a liitle bit, so that it will give the expected results , no matter if the position of the attributes is changed.
Here is the code that works even if you change the order of the attributes in rel for the anchor tag.
Here we are sorting the array which is defined in the javascript.
and also we are sorting the rel values that is being passed to the javascript function.
Code:
<html>
<head>
<title></title>
<script type="text/javascript">
var attributes=new Array("height","width","name");
//sort the array element using the in built sort() javascrit function
attributes=attributes.sort();
//declare a global variable
var finalresult="";
//this is the function which is being called when the button is clicked
function test()
{
//find all the anchor elements in the form
var link = document.getElementsByTagName('a');
//loop through them
for (var i=0; i<link.length; i++) {
//then spliting the rel and then sorting which will give us a array and it is stored in variable attrbts
var attrbts=link[i].rel.toString().split('|').sort();
//the call the function which will search for the attributes , note here we are converting attrbts again to a string
getSettings(attrbts.toString());
}
}
function getSettings(val) {
for(var i=0;i<attributes.length;i++)
{
//now from the attributes pick one value at a time and process it
var matchedIndex=val.indexOf(attributes[i].toString());
//if the attribute exists then enter the loop
if(matchedIndex>=0)
{
val=val.substring(attributes[i].length+1,val.length);
var seperatorIndex=val.indexOf(',');
//check whether the seperator(,) contains or not
if(seperatorIndex!=-1)
{
var attributeValue=val.substring(matchedIndex,seperatorIndex);
}
else
{
var attributeValue=val.substring(matchedIndex,val.length+1);
}
val=val.substring(seperatorIndex);
finalresult=finalresult+attributes[i]+" is "+attributeValue.toString()+"\n";
}
}
alert(finalresult);
//after all the processing is being done , set finalresult value to default value.
finalresult="";
}
</script>
</head>
<body>
<a href="#" rel="width:100|height:200|name:test"></a>
<input type="button" value="Click" onclick="test()"/>
</body>
</html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html lang="fr"><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><meta name="generator" content="PSPad editor, www.pspad.com"><title>Untitled</title><style type="text/css"></style></head><body><a href="#" rel="width:100|height:200|name:test">link</a><script type="text/javascript">
// A tools to see an Object with alert
Object.prototype.toString=function(){var i,c='';for (i in this) c+='\nkey '+i+' => value '+this[i];return c;}
// the links, two table and an object
var link=document.getElementsByTagName('a'),tblk=[],kyvl=[],obj={};
for (var i=0; i<link.length; i++) {
tblk=link[i].rel.split(/\|/g);
for (j=0;j<tblk.length;j++) {kyvl=tblk[j].split(/:/g);obj[kyvl[0]]=kyvl[1];}
}
alert(obj);
</script></body></html>
Reply With Quote
i hope this solves your problem
Bookmarks