$("body").append( "<p id='Zoom'>Send to: <b>"
+ full + "</b> <div id='fb-root'></div><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script><fb:send href='"
+ link + " font='' colorscheme='dark'></fb:send><br> <textarea cols='40' rows='7'>"
+ msg + "</textarea></p>"
);
What is wrong with this JavaScript code? Can't I have a script block be开发者_JS百科tween ""
? How can I fix this?
It is common to do something like this:
"<scr" + "ipt>...</scr" + "ipt>";
Having the sequence of characters </script
inside a script block ends the script block. HTML parsers know nothing about JavaScript string literal syntax, they just say everything between the <script>
start-tag and the first </script>
end-tag afterwards is a script element.
Use '<\/script>'
, or '\x3C/script>'
or similar to avoid putting <
and /
characters next to each other. You also commonly see unescape('%3C/script>')
, but that's a pretty pointless roundabout way of doing it. '</scr'+'ipt'
is also common, but not valid; technically even just the two-character sequence </
(ETAGO) is supposed to end the script block, but browsers typically give you some latitude. '<'+'/script'
would be valid.
However, as patrick said, writing <script>
elements into innerHTML
(as you are doing here with jQuery's append()
) doesn't work (and doesn't really make much sense). Normally you'd be better off using DOM-like methods to add elements to the page, and getScript
to dynamically load scripts, however with third-party scripts like this it's not certain whether even that will work. If an external script relies on document.write
, for example, it's never going to be possible to load it dynamically. Others may get tripped up by looking for their own script tag. Some trial and error may be necessary.
"<textarea cols='40' rows='7'>"+msg+"</textarea>"
Don't do stuff like this. Throwing text into HTML strings without escaping the <&"
s is a recipe for XSS security holes and bugs. jQuery has good DOM-style content creation tools, use them, eg:
$('<textarea/>', {cols: 40, rows: 7, val: msg})
You have a couple of issues.
- jQuery sanitizes
<script>
elements away when appending. - You can't have
<div>
elements (or otherdisplay:block
elements) nested inside<p>
elements.
Change the <div>
to an inline element, and use the jQuery.getScript()
[docs] method to load the script.
You should enclose the JS in a CDATA
block, if you're going to be using HTML tags in your JS.
<script type="text/javascript">
// <![CDATA[
$("body").append( '<p id="Zoom">Send to: '
+ '<b>' + full + '</b>'
+ '<div id="fb-root"></div>'
+ '<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>'
+ '<fb:send href="' + link + ' font="" colorscheme="dark"></fb:send>'
+ '<br><textarea cols="40" rows="7">' + msg + '</textarea>'
+ '</p>'
);
// ]]>
</script>
Completing Larsenal's answer, this sould work:
$("body").append("<p id='Zoom'>Send to: <b>" + full + "</b> <div id='fb-root'></div><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></scr" + "ipt><fb:send href='" + link + " font='' colorscheme='dark'></fb:send><br> <textarea cols='40' rows='7'>" + msg + "</textarea></p>");
精彩评论