JavaScript学习(二)

最新推荐文章于 2022-06-29 11:13:22 发布
最新推荐文章于 2022-06-29 11:13:22 发布
阅读量254 收藏
点赞数
分类专栏： JavaScript 文章标签： JavaScript HTML5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/YKiOS/article/details/87251645
版权

一.JavaScript输出

     JavaScript通常用于操作HTML元素。

     JavaScript访问某个HTML元素，可以使用document.getElementById(id)方法。如：

<!DOCTYPE html>
<html>
<body>

<h1>我的第一张网页</h1>

<p id="demo">我的第一个段落</p>

<script>
document.getElementById("demo").innerHTML="我的第一段 JavaScript";
</script>

</body>
</html>

    写到文档输出

    如下例子直接把<p>元素写到HTML文档输出中：

<!DOCTYPE html>
<html>
<body>

<h1>我的第一个网页</h1>

<script>
document.write("<p>我的第一段 JavaScript</p>");
</script>

</body>
</html>

    警告：请使用document.write()仅仅向文档输出写内容。

    如果在文档已完成加载后执行document.write,整个HTML页面将被覆盖：

<!DOCTYPE html>
<html>
<body>

<h1>我的第一张网页</h1>

<p>我的第一个段落。</p>

<button onclick="myFunction()">点击这里</button>

<script>
function myFunction()
{
document.write("糟糕！文档消失了。");
}
</script>

</body>
</html>

     上述示例返回值为：糟糕！文档消失了。

二.JavaScript语句

     JavaScript语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。

    下面的JavaScript语句向id="demo"的HTML元素输出文本“Hello World”:

document.getElementById("demo").innerHTML="Hello World";

    分号；    

    分号用于分隔JavaScript语句。

    通常我们在每条可执行的语句结尾添加分号。

    使用分号的另一个用处是在一行中编写多条语句。

    JavaScript代码

    JavaScript代码(或者只有JavaScript)是JavaScript语句的序列。

    浏览器会按照编写顺序来执行每条语句。

document.getElementById("demo").innerHTML="Hello World";
document.getElementById("myDIV").innerHTML="How are you?";

   JavaScript代码块

   JavaScript语句通过代码块的形式进行组合。

   块由左花括号开始，由右花括号结束。

   块的作用是使语句序列一起执行。

   JavaScript函数是将语句组合在块中典型例子。

  下面的例子将运行可操作两个HTML元素的函数：

function myFunction()
{
document.getElementById("demo").innerHTML="Hello World";
document.getElementById("myDIV").innerHTML="How are you?";
}

  JavaScript对大小写敏感

  JavaScript对大小写是敏感的。

  函数 getElementById与getElementbyID是不同的。

  JavaScript会忽略多余的空格。您可以向脚本添加空格，来提高其可读性。如下代码是等效的：

var name="Hello";
var name = "Hello";

 对代码行进行折行

 您可以在文本字符串中使用反斜杠对代码进行换行。如：

document.write("Hello \
World!");

提示：JavaScript是脚本语言。浏览器会在读取代码时，逐行地执行脚本代码。而对于传统编码来说，会在执行前对所有代码进行编译。

三.JavaScript注释

    JavaScript注释可用于提高代码的可读性。

    JavaScript不会执行注释。

    我们可以添加注释来对JavaScript进行解释，或者提高代码的可读性。

    单行注释以//开头。如：

// 输出标题：
document.getElementById("myH1").innerHTML="Welcome to my Homepage";
// 输出段落：
document.getElementById("myP").innerHTML="This is my first paragraph.";

     JavaScript多行注释

     多行注释以/*开始，以*/结尾。如：

/*
下面的这些代码会输出
一个标题和一个段落
并将代表主页的开始
*/
document.getElementById("myH1").innerHTML="Welcome to my Homepage";
document.getElementById("myP").innerHTML="This is my first paragraph.";

     使用注释来阻止执行

     如可以用注释阻止其中一条代码行的执行(可用于调试)：

//document.getElementById("myH1").innerHTML="Welcome to my Homepage";
document.getElementById("myP").innerHTML="This is my first paragraph.";

    注释用于阻止代码块的执行(可用于调试)：

/*
document.getElementById("myH1").innerHTML="Welcome to my Homepage";
document.getElementById("myP").innerHTML="This is my first paragraph.";
*/

    在行末使用注释

var x=5;    // 声明 x 并把 5 赋值给它
var y=x+2;  // 声明 y 并把 x+2 赋值给它

 

YKiOS
关注
专栏目录
js基础学习-dom
yyx1958025835的博客
06-02 885
onclick事件 document.getElementById('id名称').innerHTML =Date() DOM是Document文档对象模型 getElementById 方法“查找” id="id名称" 的 HTML 元素 innerHTML属性，输出在网页上可更改原有的内容 Date()日期函数 ECMA是标准 属性 src改变图片路径document.getElementById('myImage').src='/i/eg_bulbon.gif' ...
javascript
yyx1958025835的博客
06-02 286
<script> document.getElementById("demo").innerHTML = "我的第一段 JavaScript"; </script> 可直接写在script里
document.getElementById().innerHTML
热门推荐
qq_45330179的博客
11-11 1万+
innerHTML在JS是双向功能：获取对象的内容 或 向对象插入内容； 如：<div id="demo">这是内容</div> 我们可以通过 document.getElementById(‘demo’).innerHTML 来获取id为aa的对象的内嵌内容； 也可以对某对象插入内容， 如document.getElementById(‘demo’).innerHTML=‘这是被插入的内容’; 这样就能向id为abc的对象插入内容。 ...
JavaScript语法
index0000001的博客
06-29 672
数字字面量：整数，小数，科学计数（e）字符串字面量：用单引号’’ or双引号""表达式字面量：用于计算 ：5+6数组（Array）字面量 定义一个数组：对象（Object）字面量 定义一个对象：函数（Function）字面量 定义一个函数： js中的注释：// js数据类型： number 数字string 字符串boolean 布尔object 对象function 函数symbol 标记object 对象date 时间array 数组nullnudefined局部变量声明之后就只能在函数
JavaScript学习（三）
修竹的博客
09-23 243
事件： HTML 事件是发生在 HTML 元素上的事情。 当在 HTML 页面中使用 JavaScript 时， JavaScript 可以触发这些事件。 HTML 事件可以是浏览器行为，也可以是用户行为。例如HTML页面加载完成、HTML按钮被点击； JavaScript事件列表：HTML DOM 事件 字符串： 字符串可以存储一系列字符，如 "Hello World"。 字符串可...
头歌教学实践平台 Web前端开发基础 JavaScript学习手册十四：HTML DOM-文档元素的操作（二）
最新发布
01-20
这篇教程——"JavaScript学习手册十四：HTML DOM-文档元素的操作（二）"深入探讨了如何使用JavaScript来操纵HTML文档中的元素，进一步提升网页动态性和交互性。 DOM是HTML和XML文档的一种结构化表示，它将网页内容...
javascript学习(二)javascript常见问题总结
12-10
JavaScript是Web开发中不可或缺的一部分，尤其对于前端开发者来说，深入理解和掌握JavaScript的常见问题至关重要。在本文中，我们将探讨...不断学习和实践JavaScript的各个方面，将有助于成为一名出色的前端开发者。
头歌教学实践平台 Web前端开发基础 JavaScript学习手册九：字符串
01-20
二、字符串操作方法 1. 访问字符：JavaScript不支持直接通过索引来修改字符串，但可以通过索引来读取，如`str1[0]`。 2. 连接字符串：可以使用`+`运算符或`concat()`方法连接字符串。 3. 字符串切割：`slice()`, `...
Javascript学习笔记二 之 变量
12-11
一.关于Javascript变量声明 在Javascript中，声明一个变量 var a=1; 也可以直接 a=1; 这两种表达是有区别的， 一个是当前作用域的局部变量，另一个则是当前作用域的全局变量；... // error 二.Javascript变量作用域
何二狗的javaScript学习
01-08
JavaScript是一种广泛应用于Web开发的脚本语言，由Brendan Eich在1995年于网景公司创建，起初命名为LiveScript。由于当时Java语言的流行，它被...何二狗的代码人生正通过学习JavaScript逐步探索这个充满可能性的领域。
01）自学JavaScript
weixin_46803686的博客
04-03 214
单纯记录自学JavaScript的过程
JavaScript基础学习
aabbjj的专栏
05-28 1381
1.document.getElementById("demo").innerHTML="My First JavaScript"; 2.请使用 document.write() 仅仅向文档输出写内容。 提示：绝不要使用在文档加载之后使用 document.write()。这会覆盖该文档。 document.write(Date()); document.write("My Fir
当innerHTML遇上document.getElementById
天下无双
02-09 1万+
 不知在通常的开发中，大家有没有遇到过这样的问题。      例如现在有一个控件view plaincopy to clipboardprint?  ,如果想取这个控件的值有很多中方法，其中document.getElementById(name).value既是其中的一种。但是在实际的开发中可能碰到使用这个方法取不到值的情况。为了解决这个问题，我们有必要明白document.getEl
javascript函数和事件
weixin_44831734的博客
04-27 176
head中的javascript函数 <html> <head> <title>示例</title> <meta charset="utf-8" /> <script> function myfunction(){ x=document.getElementById("demo");//显示页面内容 x....
JavaScript中document.getElementById和document.write
u014068781的专栏
02-09 1万+
1、操作HTML元素 JavaScript访问某个HTML元素，可以使用document.getElementById（id）方法。 例子： Hello document.getElementById("demo").innerHTML="Hello world"; 显示效果： 2、写到文档输出 JavaScript写到文档输出，可以使用docum
document.getElementById('').innerHTML
weixin_30345577的博客
04-25 1558
innerHTML在JS是双向功能：获取对象的内容 或 向对象插入内容；如：<div id="demo">这是内容</div> ，我们可以通过 document.getElementById('demo').innerHTML 来获取id为aa的对象的内嵌内容；也可以对某对象插入内容，如 document.getElementById('demo').inner...
精通JavaScript：学习策略与实战技巧
"这篇资源主要分享了JavaScript学习中的一些实用技巧，包括如何转化值为Boolean类型、为函数参数赋默认值以及防止页面被嵌入到IFrame中。" JavaScript是Web开发中不可或缺的一部分，掌握其核心技巧对于提升编程效率...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值