setInterval Chrome vs Firefox [closed] - javascript

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I have a Javascript setInterval function that works in Chrome, but not in Firefox. It is supposed to keep writing a string every so often on the screen. I know document.write is not a prefer method. Here is the code:
function doSomething(){
document.write("1st string ");
}
setInterval(doSomething, 2000);
Thank you (JS newb).

When using document.write in firefox, you need to have document.open it first, you can read about it on MDN
Also, no one uses document.write anymore, and if they do, that is just redundant.
If your target is just to write strings into the body, use something like this:
function safeDocumentWrite(text) {
document.body.appendChild(document.createTextNode(text));
};
or alternatively if you want to append HTML, wrap it in a <div> first:
function safeDocumentWrite(html) {
var div = document.createElement('div');
div.innerHTML = html;
document.body.appendChild(div);
}

Related

there's an error to createElement and its attribute [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 3 years ago.
Improve this question
I try to createElement as h1 and its attribute class, but i can not get it working.
here goes my post:
function krea_ta(){
var tagy = document.cteateElement("h1");
var clasy = createAttribute("class");
clasy.value = "myclass";
tagy.setAttributeNode(clasy);
tagy.innerText = "business";
}
Where is the problem?
First things first, you've spelled "create" wrong on "createElement".
Secondly, you can either set the class as an attribute using tagy.setAttribute("class", "myclass")
or via the classList property which expects an array of strings..
tagy.classList = ["myclass"];
Edit:
The above assign of the array might not be working on all browsers (works on Chrome), as MDN states that classList is a read-only property.
tagy.classList.add(["myclass"]);
The .add method accepts parameterised values, array of values and a single value.
Why not simply do it like this:
function krea_ta(){
const tagy = document.createElement("h1");
const tagyText = document.createTextNode("business");
tagyText.appendChild(tagyText);
tagy.classList.add("myClass");
document.body.appendChild(tagy);
}

how to pass a variable to queryselectorAll? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 5 years ago.
Improve this question
Hi I want to pass a variable to queryselectorAll. I tried a couple of things but non have worked for me. I'm doing that because in my code I change the variable to a new one every time a click a button.
var container = document.getElementById(containerBox.id)
// I want containerBox.id to be called in querySelectorAll
templateDiv = document.querySelectorAll('#' + 'containerBox.id' + 'template')[0].content.firstElementChild
Thanks in advance
This question can be simplified to: How do I construct a string from fixed parts and a variable part?
The answer to that is:
'#' + containerBox.id + 'template'
(i.e. just don't put quotes around your variable name).
But why bother using .querySelectorAll() just to grab the first index? You could simply call .querySelector() instead.
And if all you need to get is an element with a specified id, you can just do this:
document.getElementById(containerBox.id + 'template')
... which is the method you're already using in your first line.

How to use `this` like an object and get its variables/functions by a string? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I've got an object.
function Obj()
{
}
Obj.prototype.doSomething = function(thing)
{
this["do" + thing]();
}
Obj.prototype.doAlert = function()
{
alert("Alert!");
}
var obj = new Obj();
obj.doSomething("Alert");
This is just a shortened down version of my object, and is a lot bigger.
What I would like to do is that if you pass in 'Alert' it will run this.doAlert(); and if I pass in 'Homework' it will run this.doHomework();
Obviously, in this case, it is stupid to do it like this, but my final project is going to be completely different.
It works fine with window like this:
window["do" + thing]();
but I don't want it to be a global function, but to be part of obj.
Does anyone have an idea how I'd go about doing this?
Thanks in advance!
It turns out that when you get the function through this['functionName'], this is not bound to it.
This means you cannot use this.foo inside any function called like above.
To fix this, I used the following code:
this["do" + thing].bind(this)();
instead of this["do" + thing]();
JSFiddle: https://jsfiddle.net/auk1f8ua/

Add dynamically html to div, what is the most correct solution? [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
What is the most correct solution between:
var html="<div>";
for(...){
html +="asdfgh";
}
html+="</div>";
document.getElementById('test').innerHTML= html;
and:
document.getElementById('test').innerHTML="<div>";
for(...){
document.getElementById('test').innerHTML +="asdfgh";
}
document.getElementById('test').innerHTML +="</div>";
The first solution is better since you don't have to find the element every iteration & update the layout.
http://jsperf.com/innerhtmlvsstring
I like the first one better, because you're only accessing the dom once to add your new element and its content. There are obviously a bunch of other ways to do it.
Following is a bit faster:
Don't do string manipulation inside for loop*
var html;
html.push ( "<div>" );
for(...){
// html +="asdfgh"; Inside for loop manipualting String is heavy.
html.push ( "asdfgh" );
}
html.push ( "</div>" );
document.getElementById('test').innerHTML= html.join("\n");

How to get the final result of javascript? [closed]

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
I have an html page with a lot of javascript code, for example the content of a div depends on length of an array :
for (var i = 0; i < movieList.length; i++) {
document.body.appendChild(document.createElement('h2')).appendChild(document.createTextNode('title: ' + movieList[i].title));
var cUL = document.body.appendChild(document.createElement('ul'));
cUL.appendChild(document.createElement('li')).appendChild(document.createTextNode(movieList[i].rating));
cUL.appendChild(document.createElement('li')).appendChild(document.createTextNode(movieList[i].year));
cUL.appendChild(document.createElement('li')).appendChild(document.createTextNode(movieList[i].length));
cUL.appendChild(document.createElement('li')).appendChild(document.createTextNode(movieList[i].isComedy));
cUL.appendChild(document.createElement('li')).appendChild(document.createTextNode('main characters: ' + movieList[i].mainCharacters.join(", ")));
}
I am using these perl LWPx::ParanoidAgent and HTML::TokeParser modules to handle the HTML code but the i want the result of the javascript script
You either need to:
Reverse engineer the JS and apply the changes it would make manually or
Run the HTML and JS through a browser or browser-like tool and read the data from its DOM
There are a number of options for the latter, including WWW::Mechanize::Firefox, WWW::Selenium and Wight.
perhaps https://getfirebug.com/ is what you're looking for. Amongst loads of other things you can view your HTML after JavaScript has altered it.

Categories

Resources