JS中单引号/双引号以及外部js引入的一些问题

一、单引号和双引号的用法的问题

        在JavaScript中可以使用单引号、双引号,二者也可以混合使用。但是,身为菜鸟的我,却碰到了一些引号的使用问题。

<body>
	<div style="border:1px solid red; height:150px;width:150px;" onclick="alert("test");"  id="test">This is a test.
	</div>
</body>

理论上,点击这个div会有弹框,但是无论你怎么点击,弹框都不出现,不信?点击查看演示。左思右想,代码都没有问题,但是修改了一个小地方,弹框就出来了

<body>
	<div style="border:1px solid red; height:150px;width:150px;" onclick="alert('test');"  id="test">This is a test.
	</div>
</body>

点击查看演示,我觉得很奇怪,于是又改了一个小地方,弹框又没了

<body>
	<div style="border:1px solid red; height:150px;width:150px;" onclick='alert('test')'  id="test">This is a test.
	</div>
</body>

点击查看演示,我有点晕头转向,为了更明白一点,一个小地方的修改,弹框有出现了

<body>
	<div style="border:1px solid red; height:150px;width:150px;" onclick='alert("test")'  id="test">This is a test.
	</div>
</body>

点击查看演示

    PS:可以把代码放到编辑器中,查看修改的小地方的字体颜色变化!!!



二、在<head>引入外部js的问题

       在一般的项目中,js、css和HTML都是分开的,一般是通过在<head>中通过对应元素的src属性引入。我在<head>中引入外部的test.js文件。

HTML:

<pre name="code" class="javascript"><body>
	<div style="border:1px solid blue; height:150px;width:150px;" onclick="test();"   id="test">This is a test.
	</div>
</body>



test.js

window.onload=function()
{
<pre name="code" class="javascript">function test()
{
alert("test");
}
}


点击div没有弹窗,效果演示


修改后test.js文件

function test()
{
alert("test");
}

弹窗出现,效果演示,也可以去掉div的onclick属性,在js中添加,修改如下:

HTML:

<body>
	<div style="border:1px solid blue; height:150px;width:150px;"   id="test">This is a test.
	</div>
</body>

修改的test.js

window.onload=function()
{
var test = document.getElementById("test");
test.onclick = function()
{
alert("test");
}
}

效果演示

JS中单引号/双引号以及外部js引入的一些问题,布布扣,bubuko.com

JS中单引号/双引号以及外部js引入的一些问题

上一篇:PHP 给图片加边框


下一篇:php读取csv文件类