how i can put <script> in double quote - javascript

I'm trying to add the script tag using JavaScript. I'm putting the tag into double quote.
My problem is something else but solves with this simple example:
<script>
document.write("<script>" + example_var + "<\/script>");
</script>
How can I fix it?

You can use two ways
Template Literals
document.write(`"<script>"${example_var}"<\/script>"`);
Single Quotes
document.write('"<script>"' + example_var + '"<\/script>"');

Related

How to add fmt:message into .html()

My problem is I'm not able to put <fmt:message key="agentIndex.label.renewalBonus" /> inside
$(”#plan1RenewalBonus“).html();
because of the Asterisk (") problem.
I hope it could be
$(”#plan1RenewalBonus“).html("<fmt:message key="agentIndex.label.renewalBonus" />");
anyone have solution for this issue?
Either escape the double quotes within the string (\") or use single quotes.
Also, the quotes in your JQuery selector are invalid. ” != "
Corrected code:
$("#plan1RenewalBonus").html('<fmt:message key="agentIndex.label.renewalBonus" />');

Generating id selector dynamically based on user-input

I am facing a problem in jQuery selector. I am generating selector string dynamically based on user-input as show below :-
jQuery("#" + userInput + "-edit").modal("show")
When the user enters value like "AdvancedResults." Selector becomes
jQuery("#AdvancedResults.-edit").modal("show")
which does not return expected element, despite the fact that
Am I doing something patchy ? Is there any better way to solve this problem ?
Btw, apologising for newbie question, as I am new to JS world.
Thanks in advance.
Just use:
Use the escaping rules from the jQuery selectors API as follows:
$("#AdvancedResults\\.-edit").modal("show");
You can replace . to \. dynamically using str.replace():
var str = "AdvancedResults.";
str = str.replace(/\./g, "\\."); // it will add add \\ dynamically before .
console.log($("#"+str+'-edit').length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<input id="AdvancedResults.-edit" type="text"/>
If your element does have an id #AdvancedResults.-edit, that is, includes a dot, you must escape it with \\ as stated in the docs jQuery Selectors
Use [attribute=""] selector in such cases where the parameter is dynamic and might contain special chars not supports by jQuery # - ID selector.
jQuery("[id='" + userInput + "-edit']").modal("show")
Example snippet :
var userInput = "abc.";
alert(jQuery("[id='" + userInput + "-edit']").val())
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input id="abc.-edit" value="test"/>
I have solved it using attribute hack.
It's as follow :-
jQuery("[id='" + userInput + "-edit']").modal("show");
It worked perfectly for me.

Replace html with html using Javascript

I want to replace a big section of html code (the content on the side) with other html code.
I have used the JavaScript code below:
document.getElementById("content").innerHTML = "";
The thing is that I can't replace html code that got the "" characters in it. Can someone please help me?
I should ad that I´m a beginner with JavaScript and as of now I want to stay away from jQuery.
try with
document.getElementById("content").innerHTML ='text to be replaced with "" ';
or with
document.getElementById("content").innerHTML ="text to be replaced with \"\"";
or with
document.getElementById("content").innerHTML ='text to be replaced with \'\'';
( \" is the escape sequence for the character " and in javascript you can use either ' or " for the strings)
here the jsfiddle sample

concatenate variable with background style broken in my case

$("#home").append('<div style="background:url("http://example.com/images/'+obj[i]+'.jpg")"');
what's wrong here? I think I'd closed it properly..
You have issues with mis-matching quotes - you need to escape the double quotes in the url properties' value, or remove them. You have also not closed the div tag properly. Try this:
$("#home").append('<div style="background:url(http://example.com/images/' + obj[i] + '.jpg)"></div>');
Example fiddle
the problem issued with the string you're building:
'<div style="background:url("http://example.com/images/'+obj[i]+'.jpg")"'
let's assume obj[i]==1.
your div will look like this:
<div style="background:url("http://example.com/images/1.jpg")"
notice two important isssues:
the div has no closing ('>' character)
the style attribute is "background:url(" - having same type of quotes prevent the navigator to understand you.
try use:
$("#home").append('<div style="background:url(/'http://example.com/images/'+obj[i]+'.jpg/')">');
good luck!

Jquery, Escaping url with variable

trying to escape and html for appending in jquery with adding a dynamic variable that i am bringing in with ajax and I seem to not be able to get the escaping correct. Here is what I have -
$("<div><div class='presiImg' style='background: url(/\'/gleam\/public\/images\/itPrecedents\/" + keep.logo + "');'></div></div>").appendTo(".myDiv');
I am unsure how to escape this correctly so I can use the variable. Thanks.
You've got a couple issues here:
You're escaping the forward slashes in your URL and that is not necessary
You are using inconsistent quotes in your .appendTo()
As a suggestion, when I append raw HTML using JS/jQuery I try to use the single-quote and the JavaScript quote, and then use the double-quotes in the HTML. For me it is just easier to see that way. Also, the single-quote in the CSS url is not required, and is perhaps confusing the matter.
Anyway, if you change your line to the following it will work:
$('<div><div class="presiImg" style="background: url(\'/gleam/public/images/itPrecedents/' + keep.logo + '\');"></div></div>').appendTo('.myDiv');
There is a runnable example below if you want to see it in action:
$(function() {
var keep = { logo : "test.jpg" };
$('<div><div class="presiImg" style="background: url(\'/gleam/public/images/itPrecedents/' + keep.logo + '\');"></div></div>').appendTo('.myDiv');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="myDiv"></div>
try
$("<div />",{
"class":"presiImg",
"style":"background: url(/gleam/public/images/itPrecedents/"+keep.logo+")"
}).appendTo(".myDiv");

Categories