如何在 JS 中嵌入 HTML 代码

如何在 JS 中嵌入 HTML 代码,第1张

新建一网页文件“sample.html",用记事本或其它文本编辑软件(如UltraEdit)打开,输入HTML代码。该网页文件包括一个蓝色的字符串,一个按钮和一个文本框。

JS代码可插入到”head"标签之间。编写Javascript代码,代码内容,并将该段代码复制到网页文件”sample.html“中标签”<head>"和“</head>之间,然后查看网页文件的显示内容。

JS代码可插入到文档中,一般位于相关联的标签的后面。例如:我们想要实现点击“Show”按钮时d出一个对话框,则可编辑如下的Javascript代码。其中需要在按钮标签内注册添加"onClick"事件。

当用鼠标点击“Show”按钮时就会d出窗口。在窗口中显示我们定义的文本内容“The Show Button Has Been Clicked!"。点击”确定“即可关闭窗口。

还可以将JS代码单独写在一个文件中,然后在需要的网页文件中直接通过"Script"标签引用。例如:我们想要实现当用鼠标点击文本框时,文本框内会被写入“Hello!百度经验”字样的效果。那么首先创建一个新的JS文件“MyHello.js",并在文件中输入代码:

修改网页文件"sample.html"文件,添加代码,其中包括对外部JS文件”MyHello.js“的引用,以及为文本框添加的获取焦点注册事件。

最终网页。 当点击文本框时就会出现“Hello!百度经验”字样。

所谓动态写入方法就是源文件代码中原来没有内容或者需要重新改变此处的要显示的文字或内容,需要用JavaScript代码来实现。动态写入是一种很常见常用的方法。1、用innerHTML写入html代码:<div id="abc"></div><script>document.getElementById("abc").innerHTML="要写入的文字或内容"</script>2、appendChild() 方法:<ul id="myList"><li>Coffee</li><li>Tea</li></ul><button onclick="myFunction()">点击向列表添加项目</button><script>function myFunction(){var node=document.createElement("LI")var textnode=document.createTextNode("Water")node.appendChild(textnode)document.getElementById("myList").appendChild(node)}</script>

1、J首先输入s_file01.js,//程序代码 document.write(" <script language=\"javascript\" src="\/com\/ Js_file02.js \" ><\/script>")。

2、 html代码 代码如下:<html> <body> <input type="button" value="ok" onclick="javascript:fun_b()"> </body> //必须在这个位置,也即<body>...</body>之下: <script language="JAVASCRIPT" src='Js_b.js'></script> </html>。

3、Js_file01.js 代码如下://程序代码 document.scripts[0].src=" Js_file02.js"。

4、看到自己的JS文件。

5、可以看到js插入成功了。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6127265.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-15
下一篇 2023-03-15

发表评论

登录后才能评论

评论列表(0条)

保存