JavaScript学习笔记003-函数0属性0模板字符串

Author:Mr.柳上原

  • 付出不亚于任何的努力
  • 愿我们所有的努力,都不会被生活辜负
  • 不忘初心,方得始终

函数函数函数函数函数函数函数函数函数函数函数函数

for

if

for

if

for

悟性很重要

<!DOCTYPE html> <!-- 文档类型:标准html文档 -->

<html lang='en'> <!-- html根标签 翻译文字:英文 -->

<head> <!-- 网页头部 -->

<meat charset='UTF-8'/> <!-- 网页字符编码 -->

<meat name='Keywords' content='关键词1,关键词2'/>

<meat name='Description' content='网站说明'/>

<meat name='Author' content='作者'/>

<title>前端59期学员作业</title> <!-- 网页标题 -->

<link rel='stylesheet' type='text/css' href='css/css1.css'/> <!-- 外链样式表 -->

<style type='text/css'> /*内部样式表*/

</style>

</head>

<body> <!-- 网页主干:可视化区域 -->
<div id='box' dd='abc'></div>

<script>

// 字符串拼接

// 第一种方法:es5
let color = 'red';
srt.innerHTML +=  "<li style='color:" + color + ";'>" + ttd + "</li>";

// 第二种方法:es5
srt.innerHTML += "<li>" + 
"<p>" +
"<h1></h1>" +
"</p>" +
"</li>";

// 第三种方法:es6(模板字符串)
// 模板字符串内的变量会被执行:${变量}
srt.innerHTML += `<li style="color:${color};">${ttd}</li>`;

// 函数 function

// 事件函数
document.onclick = function () {
console.log('这是事件函数');
} // .onclick 点击事件

// 匿名函数:没有命名,不能独立存在,必须赋予名字
function  () {
console.log('fn');
}

// 具名函数
function fn () {
console.log('fn');
} // 直接声明的具名函数(函数声明)
let fn2 = function () {
console.log('fn2');
} // 给匿名函数一个变量名的具名函数(函数表达式)

// 函数声明时不能自执行,必须通过函数名加(),函数表达式可以自执行
let fn2 = function () {
console.log('fn2');
} ();

// 函数一旦加(),就是调用(执行函数)

// 函数名加(),就会自执行

// 函数调用
function fn () {
console.log('函数名调用');
}
document.onclick = fn; // 函数名调用
let arr = [function fn () {
console.log('数组调用');
}] 
arr[0] (); // 数组调用
let obj = {
a:function () {
console.log('对象调用')
}
}
obj.a (); // 对象调用

// 函数变量调用
fn (2,3);
fn (5,7);
fn (8,9); // 实参
function (a,b) { // 形参
console.log('计算开始');
console.log(a+b);
console.log('计算结束');
}

// 形参可以设置默认值(a,b=1),当b没有参数时,默认值生效

// 当形参没有设置默认值(a,b),而b没有参数时,b默认为undefined

// 属性:基础类型不能设置属性,复杂类型可以设置属性

// 元素中系统自带的属性:合法的对象属性

// 元素中自定义的属性:自定义属性
let arr = []
arr.arrr = 123; // 自定义属性
console.log(arr.rrrr);
let ojb = {}
ojb.ojbk = 123; // 自定义属性
console.log(ojb.ojbk);
function fn () {}
fn.fnnn = 123; // 自定义属性
console.log(fn.fnnn);

// 函数返回值
function fn (a,b) {
let str = a+b;
return str; // 返回值

// 函数执行完,默认返回undefined

// 函数里只能有一个return,遇到return就停止运行,并把return后面的值返回
}
let num = fn (1,2);
console.log(num);

// 获取标签权限的闭包模版
function getbq (bq) {
return document.getElementById(bq);
}
let div01 = getbq('box');
div01.innerHTML = '获取标签权限的闭包方式(id)'

// 获取自定义标签属性
let div01 =document.getElementById('box');
console.log(div01.getAttribute('dd')); // 获取div的自定义标签属性
div01.setAttribute('dd','def'); // 重新设置div的自定义标签属性
div01.removeAttribute('dd'); // 删除div的自定义标签属性

// 系统提供的方法(API)

// . 与 []:数字与小数点结合会默认为小数
let ojb = {
a:1,
b:2,
}
let a = '123';
console.log(obj.a); // 取对象里的值a
console.log(obj[a]); // 取变量a的值123
console.log(obj['a']); // 取对象里的值a

</script>

</body>

</html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏无所事事者爱嘲笑

关于setTimeout和setInterval的函数参数问题

16820
来自专栏Pythonista

Go 语言常量

在每一个const关键字出现时,被重置为0,然后再下一个const出现之前,每出现一次iota,其所代表的数字会自动增加1。

7510
来自专栏程序生活

Leetcode-Easy 806. Number of Lines To Write String

给一个字符串S,从左到右将它们排列行,每行最大长度为100,,同时给定一个数组withds,widths[0]对应着 a的宽度, widths[1]对应着b的宽...

9420
来自专栏web

DOM 1

14330
来自专栏积累沉淀

Linux shell ${}简单用法

Linux shell ${}简单用法 [转]http://linux.chinaunix.net/techdoc/develop/2007/05/05/9...

20260
来自专栏Golang语言社区

Go 语言范围(Range)

Go 语言中 range 关键字用于for循环中迭代数组(array)、切片(slice)、通道(channel)或集合(map)的元素。在数组和切片中它返回元...

32750
来自专栏Golang语言社区

【基础篇】Go 语言范围(Range)

Go 语言范围(Range) Go 语言中 range 关键字用于for循环中迭代数组(array)、切片(slice)、通道(channel)或集合(map)...

388160
来自专栏python百例

06-字符串使用基础

11520
来自专栏十月梦想

类的传参以及super属性和super对象

在上述例子我们也看到了指定的子类特有的方法直接指定,那么我们如何指定子类特有的属性呢?我们这里用到了super方法;

13620
来自专栏Golang语言社区

Go 语言常量

常量是一个简单值的标识符,在程序运行时,不会被修改的量。 常量中的数据类型只可以是布尔型、数字型(整数型、浮点型和复数)和字符串型。 常量的定义格式: cons...

30490

扫码关注云+社区

领取腾讯云代金券