Good morning peeps! I use this to hide my email. Its a web service that asuficates it. I modified it to use document.getElementById. How would I go about using this when I want to have the email address display more than once on the same page? As is it only works on the first id it hits. Obviously I could use the script twice with a different id. But is there a better way?? Thanks!
// Hide Email
var s="=b!isfg>#nbjmup;dpoubduAopsuitboejfhpqspqfsuznbobhfnfou/dpn#?dpoubduAopsuitboejfhpqspqfsuznbobhfnfou/dpn=0b?";m="";for(i=0; i<s.length; i++)m+=String.fromCharCode(s.charCodeAt(i)-1);document.getElementById('hideemail').innerHTML=(m);
A id’s are designed to be unique id’s, you can use a class name instead.
function hideEmail(el) {
// hide emails in here, where el is the element containing a hidden email
...
}
var hiddenEmails = document.querySelectorAll('.hideemail'),
i;
for (i = 0; i < hiddenEmails.length; i += 1) {
hideEmail(hiddenEmails[i]);
}
So from the code you posted, instead of using document.getElementById(‘hideemail’).innerHTML, in the function you would instead use el.innerHTML
Ok I know this isn’t correct. But how do I replace the get element by id bit and make this correct? Thnaks!
<script type="text/JavaScript">
function hideEmail(el) {
var s="=b!isfg>#nbjmup;dpoubduAopsuitboejfhpqspqfsuznbobhfnfou/dpn#?dpoubduAopsuitboejfhpqspqfsuznbobhfnfou/dpn=0b?";m="";for(i=0; i<s.length; i++)m+=String.fromCharCode(s.charCodeAt(i)-1);document.getElementById('hideemail')el.innerHTML=(m);
}
var hiddenEmails = document.querySelectorAll('hideemail'),
i;
for (i = 0; i < hiddenEmails.length; i += 1) {
hideEmail(hiddenEmails[i]);
}
</script>
It’s a css selector that you use in the querySelector, so if it’s an id then you prefix the name with #, and if it’s a class then you prefix it with a fullstop.
To select all elements with a class of hideemail, you would use document.querySelectorAll(‘.hideemail’)
So what you should do is to replace the id=“hidemail” from your HTML with class=“hideemail”
To expand on the above, use your browser console to check the page for errors.
Also, if you use proper indentation then things will become more apparent.
Hmm - wouldn’t it be better to leave the innerHTML out of the for loop, and do it afterwards - or is this a rabbit hole the like of which we do not want to get in to?
I was leaving the whole “is this even a good idea” side of things alone.
I just refactored the code until it worked and then posted it after the conversation went quiet.
But you’re right, having it within the for loop is superfluous.
Well spotted
<!DOCTYPE html><html><head><meta charset="UTF-8">
<title></title>
<style type="text/css">
/* --- Contact --- */
.hideemail {
word-break:break-word;
}
.hideemail b {
display:none;
}
</style>
</head>
<body>
<span class="hideemail">test.com</span>
<br>
<br>
<span class="hideemail">test.com</span>
<script type="text/JavaScript">
function hideEmail(el) {
var s="=b!isfg>#nbjmup;dpoubduAopsuitboejfhpqspqfsuznbobhfnfou/dpn#?dpoubduAopsuitboejfhpqspqfsuznbobhfnfou/dpn=0b?",m="";
for(var i=0; i < s.length; i++){
m += String.fromCharCode(s.charCodeAt(i)-1);
}
el.innerHTML=(m);
}
var mailAddresses = document.querySelectorAll('.hideemail');
for (var i = 0; i < mailAddresses.length; i += 1) {
hideEmail(mailAddresses[i]);
}
</script>
</body>
</html>
And above see you said this may not even be a good idea? Are you referring to the code or the method of email absofication? Because I find it to work perfect as a spam deterrent. Thanks!
