I have links on page and want mask them. I want,
that at onLoad all points in urls (which are in href) will be replaced with something like "|",
so instead of
link
there is somehting like
link.
Then, at onClick replacements should be reversed to make links working again.
Need help to get this code to work:
function mask() {
var str = document.getElementByName("a");
var x = str.attributes.href.value.replace('.', '"|"');
document.getElementsByTagName("a").attributes.href.value = x;
}
function unmask(){
var str = document.getElementByName("a");
var x = str.attributes.href.value.replace('"|"', '.');
document.getElementsByTagName("a").attributes.href.value = x;
}
<body onLoad="mask()">
link
</body>
You have to use the getElementsByTagName method:
function mask() {
var a = document.getElementsByTagName('a');
for (var i = 0; i < a.length; i++) {
a[i].attributes.href.value = a[i].attributes.href.value.replace(/\./g, '"|"');
}
}
function unmask() {
var a = document.getElementsByTagName('a');
for (var i = 0; i < a.length; i++) {
a[i].attributes.href.value = a[i].attributes.href.value.replace(/"\|"/g, '.');
}
}
<body onLoad="mask()">
link
</body>
There are several issues in your code:
document.getElementByName("a") is not valid
str.attributes.href.value is not valid
You need to go global replace to replace all the . with | and vice-versa.
function mask() {
var str = document.getElementsByTagName("a")[0];
var x = str.href.replace(/\./g, '"|"');
str.href = x;
}
function unmask(){
var str = document.getElementsByTagName("a")[0];
var x = str.href.value.replace(/"|"/g, '.');
str.href = x;
}
<body onLoad="mask()">
link
</body>
Related
<script>
var y="<br>"
function repeater(num){
for (var i=0;i<num;i++)
{document.write(y) }
}
document.write(repeater(4))
</script>
My goal is to make the tag appear
4 times, not the actual breaks. The result shows undefined.
Since the question is asking for Javascript solution not JQuery (since no jQuery tags), I'll add the answer using Javascript.
<script>
var y = "<br>"
function repeater(num) {
for (var i=0; i < num; i++) {
document.body.innerText += y;
}
}
repeater(4);
</script>
or maybe you need to set a text into the spesific element (<div id="app"><div>)? no problem, we can improve the code a little bit.
<script>
var y = "<br>"
function repeater(el, num) {
for (var i=0; i < num; i++) {
el.innerText += y;
}
}
var el = document.getElementById('app');
repeater(el, 4);
</script>
<script>
var res = "";
var y="<br>";
function repeater(num){
for (var i=0;i<num;i++) {
res = res + y;
}
$('#customDiv').text(res);
}
(repeater(4))
You can put a custom <div id="customDiv"></div> inside your html file.
So - I have a string in javascript liks so:
var foo = "Hello™";
I need to print this out in HTML (via JS) so it looks like this:
Hello™
Sounds easy, but I obviously am missing something cause I can't figure out a simple solution for it yet.
EDIT - here is more code:
var label = document.createElement('label');
var foo = selectData.options[i][1]; // this is "Hello&trade";
label.innerHTML = foo;
container.appendChild( label );
Just append it into the innerHTML property.
innerHTML will html encode the given input and that append it to the node.
var foo = "Hello™";
document.getElementById('label').innerHTML = foo;
<label id="label"></label>
First separate the '&trade' and check for it in an if-statement and then give var the value of the hexcode equivalent which is 'u2122' then the rest of the code should do the work.
String.prototype.hexEncode = function(){
var hex, i;
var result = "";
for (i=0; i<this.length; i++) {
hex = this.charCodeAt(i).toString(16);
result += ("000"+hex).slice(-4);
}
return result
}
String.prototype.hexDecode = function(){
var j;
var hexes = this.match(/.{1,4}/g) || [];
var back = "";
for(j = 0; j<hexes.length; j++) {
back += String.fromCharCode(parseInt(hexes[j], 16));
}
return back;
}
var str = "\u2122";
var newStr = (str.hexEncode().hexDecode());
var foo = "Hello" + newStr;
console.log(foo);
If I have webpage with for example alot of <td class="house">111 22</td>. The numbers are random but classname is the same and the blankspace between the numbers are at same position in all of them, and I want to remove the space in all of them after page is loaded. How should the script look like to work?
How about using this
var str = "111 22";
str = str.replace(" ","");
code example :
<script type="text/javascript">
//Page Initial
$(function() {
removeSpace();
});
function removeSpace(){
var str = $(".house").html();
str = str.replace(" ","");
$(".house").html(str);
}
</script>
Do this:
var elems = document.querySelectorAll('td.house');
for(var i = 0 ; i < elems.length; i++){
elems[i].textContent = elems[i].textContent.replace(" ","");
}
use the following code:
<script type="text/javascript">
window.onload = removeSpace;
function removeSpace() {
var emt = document.getElementById("mytable");//mytable is the Id of the table
d = emt.getElementsByTagName("tr")[0],
r = d.getElementsByTagName("td");
for (var i = 0; i < r.length; i++) {
var str = r[i].innerText;
r[i].innerText = str.replace(" ", "");
}
}
</script>
I would like to write a (Javascript?) function to be included in HTML pages that allows me to render the function arguments tagged as kbd separated by "+"s and able to take an arbitrary number of input arguments.
So, for example, fnRenderKBD(Ctrl+X, Y, Z) would render as Ctrl+X+Y+Z.
The important thing is that the function should be able to take a variable number of arguments.
Is it possible to write such a function (if so, how)? I have next to no knowledge of JS.
My answer at the bottom is not the best thing I have ever written. A better solution would look something like:
function fnRenderKBD(elem, keysToDisplay) {
var delimiter = '';
var content = null;
for(var i = 0, length = keysToDisplay.length; i < length; i++) {
var renderedKey = document.createElement('kbd');
renderedKey = setText(renderedKey, keysToDisplay[i]);
if (i > 0) {
elem.appendChild(document.createTextNode('+'));
}
elem.appendChild(renderedKey);
}
}
function setText(elem, text) {
if (elem.textContent){
elem.textContent = text;
}else{
elem.innerText = text;
}
return elem;
}
(function() {
var keys = [
'Ctrl+X',
'Y',
'Z'
];
var elem = document.getElementById('display');
fnRenderKBD(elem, keys);
}());
Demo: http://jsfiddle.net/wPg7z/
Something like this should work:
function fnRenderKBD(elem, keysToDisplay)
{
var delimiter = '';
var content = '';
for(var i = 0, length = keysToDisplay.length; i < length; i++) {
content+= delimiter + '<kbd>' + keysToDisplay[i] + '</kbd>';
delimiter = '+';
}
elem.innerHTML = content;
}
(function() {
var keys = [
'Ctrl+X',
'Y',
'Z'
];
var elem = document.getElementById('display');
fnRenderKBD(elem, keys);
})();
Demo: http://jsfiddle.net/gTYxP/1/
i want to get the id from the url bar and insert it into the href
$("a[href='send_message.php?act=pm&id=$id']").colorbox({width:"500", height:"350", iframe:true});
there's a jquery plugin to make this ridiculously simple:
see: http://plugins.jquery.com/project/query-object
e.g.
var id = $.query.get('id');
$("a[href='send_message.php?act=pm&id="+id+"']").colorbox({width:"500", height:"350", iframe:true});
For those not using jQuery or any other JS library:
var searchString = document.location.search;
// strip off the leading '?'
searchString = searchString.substring(1);
var gvPairs = searchString.split("&");
var getVars = [];
for (i = 0; i < gvPairs.length; i++)
{
var gvPair = gvPairs[i].split("=");
getVars[gvPair[0]] = gvPair[1];
}
So if the URL string was index.php?id=3&page=2&display=10 then:
getVars['id'] = 3;
getVars['page'] = 2;
getVars['display'] = 10;