美文网首页
JavaScript:直接写入 HTML 输出流

JavaScript:直接写入 HTML 输出流

作者: convertible | 来源:发表于2018-01-30 08:58 被阅读0次

1.document.write

直接写入 HTML 输出流

document.write(<h1>这是一个标题</h1>)

注意:只能在 HTML 输出中使用 document.write。如果您在文档加载后使用该方法,会覆盖整个文档。
2.JavaScript:对事件的反应
实例
<button type="button" onclick="alert('欢迎!')">点我!</button>
alert() 函数在 JavaScript 中并不常用,但它对于代码测试非常方便。
onclick 事件只是您即将在本教程中学到的众多事件之一
3.改变 HTML 内容
实例
x=document.getElementById("demo") //查找元素
x.innerHTML="Hello JavaScript"; //改变内容
您会经常看到 document.getElementById("some id")。这个方法是 HTML DOM 中定义的。
DOM (Document Object Model)(文档对象模型)是用于访问 HTML 元素的正式 W3C 标准。
4.改变 HTML 图像
动态地改变 HTML <image> 的来源(src):

<script>
function changeImage()
{
    element=document.getElementById('myimage')
    if (element.src.match("bulbon"))
    {
        element.src="/images/pic_bulboff.gif";
    }
    else
   {
        element.src="/images/pic_bulbon.gif";
   }
}
</script>

JavaScript 能够改变任意 HTML 元素的大多数属性,而不仅仅是图片。
5.改变 HTML 样式
改变 HTML 元素的样式,属于改变 HTML 属性的变种。
实例
x=document.getElementById("demo") //找到元素
x.style.color="#ff0000"; //改变样式
6.验证输入
JavaScript 常用于验证用户的输入。
实例
if isNaN(x) {alert("不是数字")};

JavaScript用法

1.HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
通常,我们需要在某个事件发生时执行代码,比如当用户点击按钮时。
如果我们把 JavaScript 代码放入函数中,就可以在事件发生时调用该函数。
2.外部的脚本文件
也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。
外部 JavaScript 文件的文件扩展名是 .js。
如需使用外部文件,请在 <script> 标签的 "src" 属性中设置该 .js 文件:

实例

<!DOCTYPE html> <html> <body> <script src="myScript.js"></script> </body> </html>
你可以将脚本放置于 <head> 或者 <body>中,放在 <script> 标签中的脚本与外部引用的脚本运行效果完全一致。

myScript.js 文件代码如下:

function  myFunction()  {  document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; }

外部脚本不能包含 <script> 标签。

相关文章

  • 学习笔记-js-2017.2.20

    1、JavaScript:直接写入 HTML 输出流 2、JavaScript:对事件的反应 3、JavaScri...

  • JavaScript:直接写入 HTML 输出流

    1.document.write 直接写入 HTML 输出流 注意:只能在 HTML 输出中使用 document...

  • JavaScript常用互动方法

    一、输出内容document.write()可用于直接向HTML输出流写入内容。简单的说就是直接在网页中输出内容。...

  • JavaScript 简介

    JavaScript:写入 HTML 输出 提示:您只能在 HTML 输出中使用 document.write。如...

  • JavaScript入门2

    JavaScript输出内容 document.write() 可用于直接向 HTML 输出流写内容。简单的说就是...

  • JS基础知识掌握

    JavaScript-输出内容(document.write)可用于直接向 HTML 输出流写内容。简单的说就是直...

  • JavaScript HTML DOM - 改变 HTML

    HTML DOM 允许 JavaScript 改变 HTML 元素的内容。 ** 改变 HTML 输出流**Jav...

  • JavaScript基础

    JavaScript 轻量的脚本语言 插入HTML中的编程语言 写入HTML输出 按钮反应 访问HTML元素 Ja...

  • JavaScript

    JavaScript输出 1、使用window.alert()弹出警戒框 2、使用innerHTML写入到HTML...

  • JavaScript 笔记

    用法 1 外部 javascript 文件不使用 标签,直接写 javascript 代码。2 HTML 输出...

网友评论

      本文标题:JavaScript:直接写入 HTML 输出流

      本文链接:https://www.haomeiwen.com/subject/hyaxzxtx.html