[JS] sClassName.replace is not a function

[Mei]

Ik had voor een project een getElementsByClassName functie nodig (dat die gewoon nog _steeds_ niet ingebouwd is...). Na wat zoeken vond ik van Robert Nyman een functie en ik wilde daar een object method van maken, wat resulteerde in de volgende code:

JavaScript:

Object.prototype.getElementsByClassName=getElementsByClassNameMethod;
function getElementsByClassNameMethod(sClassName, sTagName)
{
    getElementsByClassName(this, sClassName, sTagName)
}
function getElementsByClassName(oElm, sClassName, sTagName)
{
    var arrElements=(sTagName=='*'&&oElm.all)?oElm.all:oElm.getElementsByTagName(sTagName);
    var arrReturnElements=[];
    sClassName=sClassName.replace(/-/g, '\-');
    var oRegExp=new RegExp('(^|\s)' + sClassName + '(\s|$)');
    var oElement;
    for(var i=0; i<arrElements.length; i++)
    {
        oElement=arrElements[i];
        if(oRegExp.test(oElement.className))
        {
            arrReturnElements.push(oElement);
        }
    }
    return (arrReturnElements)
}

getElementsByClassName() is van Nyman, ik heb alleen de code zo aangepast dat het aansluit bij hoe ik code schrijf. Als ik deze code bij een pagina invoeg, dan geeft de FF Javascript console : "sClassName.replace is not a function". Ik zie zelf geen fout daar en afgezien van de naam van sClassName heb ik daar ook niks aangepast.

[Yo-han]

Is sClassName wel een string? Doe even een alert of document.write in je code plakken en check het type van sClassName even. Replace kan namelijk voor zover ik weet alleen op een string en niet op bijv. een object of integer.

[Mei]

De functie wordt nog niet écht aangeroepen, maar blijkbaar wel semi-echt zegmaar, want als ik die replace regel vervang door alert(sClassName); dan krijg ik een aantal alerts die "0" geven.

//edit: Hij gaat volgens mij dus elk object af om die method toe te kennen ofzo. Dat idee heb ik althans, maar het waren dan wel erg weinig alerts (5 ofzo) voor een pagina vol met elementen (honderden).

[ Voor 35% gewijzigd door Mei op 31-07-2007 11:36 ]

[Yo-han]

Als hij 0 alert zou ik de waarde in sClassName eerst eens casten naar een string en dan nog eens testen.

[crisp]

Mei schreef op dinsdag 31 juli 2007 @ 11:10:
(dat die gewoon nog _steeds_ niet ingebouwd is...)

Gran Paradiso heeft een native getElementsByClassName method

Verder zou ik HTMLElement prototypen en niet Object en XPath gebruiken indien beschikbaar. IE-support is niet noodzakelijk neem ik aan?

[Mei]

Yo-han schreef op dinsdag 31 juli 2007 @ 11:43:
Als hij 0 alert zou ik de waarde in sClassName eerst eens casten naar een string en dan nog eens testen.

Ga ik even proberen

crisp schreef op dinsdag 31 juli 2007 @ 11:51:
[...]

Gran Paradiso heeft een native getElementsByClassName method

Ik doelde op final releases van browsers, he

Verder zou ik HTMLElement prototypen en niet Object en XPath gebruiken indien beschikbaar. IE-support is niet noodzakelijk neem ik aan?

Wel noodzakelijk, dus XPath gaat niet werken. Wat is het voordeel van HTMLElement prototypen? AFAIK kan je alleen dingen als Function, Number, Object, etc... prototypen.

[Verwijderd]

Mei schreef op dinsdag 31 juli 2007 @ 12:06:
Wat is het voordeel van HTMLElement prototypen?

Alle objecten inheriten van Object dus als je Object prototypet komen bij elke for-in loop voor elk object die geprototypete methods of properties terug. Is niet leuk.

[crisp]

Mei schreef op dinsdag 31 juli 2007 @ 12:06:
[...]

Wel noodzakelijk, dus XPath gaat niet werken.

Dit gaat ueberhaupt in IE niet werken omdat DOM elementen in IE niet overerven van Object, vandaar dat ik het ook vroeg want als IE support wel van belang is dan zal ik het hele omzetten naar Object method maar heel snel gaan vergeten

XPath zou ik zeker wel als branch toevoegen aangezien dat nagenoeg even snel is als de native getElementsByClassName method in Gran Paradiso. Check als voorbeeld getElemensByClassName in onze eigen js

[ Voor 46% gewijzigd door crisp op 31-07-2007 13:04 ]

[Mei]

Ik ben geen JS en XPath held, dus pas even op met ingewikkeld doen aub JS ben ik me sinds kort pas goed in het verdiepen (kon altijd maar een beetje) en van XPath weet ik sinds kort ongeveer wat het doet.

Ik zal dan wel gewoon de functie los gebruiken. Als property method leek het me wel mooi om te gebruiken, maar als IE het niet ondersteunt... (Kan me niet herinneren dat in dat boek gelezen te hebben, zal wel aan mij liggen dan).

XPath bouw ik dan wel in als ik daar wat meer vanaf weet. Eerst even dit werkend krijgen.

Heeft iemand trouwens nog een idee waarom deze functie nou uitgevoerd wordt?

[crisp]

Mei schreef op dinsdag 31 juli 2007 @ 17:59:
Ik zal dan wel gewoon de functie los gebruiken. Als property method leek het me wel mooi om te gebruiken, maar als IE het niet ondersteunt... (Kan me niet herinneren dat in dat boek gelezen te hebben, zal wel aan mij liggen dan).

Welk boek?

Heeft iemand trouwens nog een idee waarom deze functie nou uitgevoerd wordt?

Zonder de code in context te zien niet. Overigens zou ik de prototype method toewijzing pas doen nadat je de functie gedefinieerd hebt

[Alex)]

Heb je crisp's [handig] getElementsByClassName al bekeken?

[crisp]

Alex) schreef op dinsdag 31 juli 2007 @ 18:08:
Heb je crisp's [handig] getElementsByClassName al bekeken?

Da's oude meuk Ik verwees al eerder naar de Tnet js code

[Mei]

crisp schreef op dinsdag 31 juli 2007 @ 18:06:
[...]

Welk boek?

Professional Javascript for Web Developers van Nicholas C. Zakas

[...]

Zonder de code in context te zien niet. Overigens zou ik de prototype method toewijzing pas doen nadat je de functie gedefinieerd hebt

Hmm, logisch. Soms ben ik met scripting zo lam bezig dat ik even later (of nu pas in dit geval) doorheb dat het niet werkt vanwege zoiets doms. Het gaat niet fout omdat ik het niet weet, maar omdat ik er niet op let.

crisp schreef op dinsdag 31 juli 2007 @ 18:20:
[...]

Da's oude meuk Ik verwees al eerder naar de Tnet js code

Maar wel interessant om even snel door te nemen Verschillende benaderingen, verschillende snelheden in browsers enzo. Wel leuk om te zien hoe je dat gedaan hebt.

[funkwurm]

offtopic:
[code=js]
if (label in preloadImages)
[/code]
Hoelang kan dat al? if (.. in ..) voor arrays? En ik al die jaren indexOf'en op een join(), damn...

[crisp]

funkwurm schreef op dinsdag 31 juli 2007 @ 23:47:

offtopic:
[code=js]
if (label in preloadImages)
[/code]
Hoelang kan dat al? if (.. in ..) voor arrays? En ik al die jaren indexOf'en op een join(), damn...

Sinds javascript 1.4, en vziw ook IE5.5+
Dit is leuk:

JavaScript:

function Set()
{
    var set = {}, i = arguments.length;
    while (i--)
        set[arguments[i]] = 1;

    return set;
}

var foo = 'bar';
if (foo in Set('tralala', 'whatever', 'foo', 'bar')) {}

[Verwijderd]

funkwurm schreef op dinsdag 31 juli 2007 @ 23:47:

offtopic:
[code=js]
if (label in preloadImages)
[/code]
Hoelang kan dat al? if (.. in ..) voor arrays? En ik al die jaren indexOf'en op een join(), damn...

Ik weet niet of je je afvraagt of je met de in operator kan kijken of een array een bepaald element heeft maar dat kan niet. De in operator kijkt of een object een bepaalde property heeft.

JavaScript:

var a = ['nul','een','twee'];
alert(a[1]); // 'een' obv index
alert(a['1']); // 'een' obv van property

Oftewel, indexed array members zijn ook als 'property' te benaderen. if(i in ..) op arrays toepassen vraag je alleen of de index i in de array bestaat.
Dus indeOf'en op een join() is iets heel anders:

JavaScript:

var a = ['nul','een','twee'];
var s = a.join();
alert(s.indexOf('twee')); // 8
alert('twee' in a); // false

Mozilla Dev reference

[ Voor 6% gewijzigd door Verwijderd op 01-08-2007 10:55 ]