首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >JS(javascript)入门

JS(javascript)入门

作者头像
小末快跑
发布2019-07-03 17:46:12
1.1K0
发布2019-07-03 17:46:12
举报
文章被收录于专栏:日常撸知识日常撸知识

起因是在用python的Django做一个页面,需要对原先的文章进行修改,怎么在文本框中填充原先的数据?由于文本框使用了富文本编辑器,发现不只是简单的在input里使用value。最后发现可以用JS来实现,html页面如下:

< form class ='form' action="" method="post" >


{ % csrf_token %}


{{blogform.as_p}}

{ % for blog in blog %}
    
{ % autoescape off %}

< script language = 'javascript' >
document.getElementById('id_title').value = "{{blog.title}}"
document.getElementById('id_author_name').value = "{{blog.author}}"
document.getElementById('id_tag').value = "{{blog.tag}}"
document.getElementById('id_content').value = "{{blog.content}}"
< / script >

{ % endautoescape %}

{ % endfor %}



< button class ="btn-lg" type="submit" > 请提交 < / button >

< / form >

因此问题的到解决:

javascript的基础

JS程序不需要编译,程序在运行的时候才翻译成机器语言,每执行一次都要翻译一次,因此效率低,但跨平台性好。js语句就是向浏览器发出命令,告诉浏览器该做什么。

script标签可以放在页面的任何位置,一般在head和body中。当引入文件和内部js同时存在时,内部js不会执行。

不能使用<script>的单标签。

js 语句严格区分大小写。

{ } 一个花括号就是一个代码块。

1.js 解释

单行注释://

多行注释:/*、、、、*/

2.数据类型

基本数据类型:String、number、boolean、null、undefined

引用数据类型:object、function

(String :必须由成对的单引号或双引号包起来

number:带小数点、不带小数点的都可

boolean:true、false

undefined:声明的变量没有值

null:表示尚未存在的对象

可以用typeof来检测数据的类型:

typeof "john" //返回值是string

typeof 3.14 //返回值是number

3.运算符

算术运算符:+ 、- 、* 、/ 、%(取余) 、++(递增) 、--(递减)

a++:后自增,先将结果赋予当前位置,然后再自增(先运算,后自增)

++a:前自增,将自增后的结果赋予当前位置(先自增,后运算)

赋值运算符: = 、+= 、-= 、*= 、/= 、%=

关系运算符:> 、< 、>= 、<= 、== 、=== (三等)、!= 、!==

“==”两边若有字符串类型,可自动转换为数值型再进行比较

“===”不可自动转换两边类型,因类型不同,结果为false。

辑运算符:&& 、|| 、!

Math.round()四舍五入(针对整数)

4.逻辑控制与流程控制

(a) if语句:

if (bool表达式){

    语句
}

else if (bool表达式){

    语句
}
    
else {

    语句
}

(2) switch—case语句:

switch (var){

       case 值1 :语句;break;
        case 值2 :语句;break;
        case 值3 :语句;break;
        case 值4 :语句;break;
        case 值5 :语句;break;
        default:语句;break;
            }

(3) while语句:

while(逻辑表达式){

        循环体
            }

(4) do—while语句:先执行一次循环,在判断,

do
{
执行
}
while (条件);

(5) for语句:

for (var i=0 ;i < max;i++){

    循环体
    }

(6) Break 语句:

break 语句可用于跳出循环。break 语句跳出循环后,会继续执行该循环之后的代码。

for (i=0;i < 10;i++)
    {
    if (i == 3)
    {
    break;
    }
    x = x + "it is " + i + "<br>";
}

(7)continue语句:中断循环中的迭代,如果出现了指定的条件,然后继续循环中的下一个迭代。

for (i=0;i <= 10;i++)
{
    if (i == 3)
        continue;
    x = x + "It is " + i + "<br>";
}

一个简单的例子:

<p>点击下面的按钮来显示今天是周几:</p>
<button onclick="myFunction()">点击这里</button>
<p id="demo5"></p>
<script>
function myFunction(){
   var x;
   var d=new Date().getDay();
   switch (d){
      case 0:x="小花";
       break;
      case 1:x="小红";
        break;
      case 2:x="小白";
        break;
        case 3:x="小谢";
          break;
      case 4:x="小蓝";
       break;
      case 5:x="小元";
        break;
      case 6:x="全部一起";
       break;
   
   }
   document.getElementById("demo5").innerHTML=x;
}
</script>

结果:

JS在表单验证,输入验证等方面很好用。

“作为一种脚本语言,JavaScript可以说是非常成功的,它在相当多的领域中得到了广泛应用。它不但可以用于编写Web浏览器端(或者称为客户端)脚本,实现在Web页面上下文中执行的程序,而且可以在服务器端用于编写可处理浏览器提交的信息并相应地更新浏览器显示的Web服务器程序。

在最典型的客户端应用中,JavaScript脚本程序被嵌入到HTML文件中,随着HTML文件一同下载到浏览器端。浏览器读HTML文件,然后解释执行并显示其中的元素。读取HTML文件并分辨其中的元素的过程称为语法分析或解析(parsing)。如果解析到JavaScript脚本,则浏览器执行其脚本语句。”

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2019-04-21,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 小末快跑 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档