<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!--
行内式 --- 与css的行内式基本相同
在标签中,通过 script标签 来定义JavaScript代码
但是实际操作中,一般是通过 定义 事件来 定义JavaScript程序代码
这样的行内式,我们在实际项目中基本不会使用
只要了解即可
-->

//onclick是js点击事件

<!-- 在 代码中 直接定义 script 程序代码内容 -->
<div id="div1" style="color: red;" onclick="window.alert('我是点击弹出的内容')">你点我试试</div>
<div id="div2" style="color: blue;" onclick= fun1() >试试就试试</div>
<!-- 特殊的标签,a标签
在 a标签中 有 href 属性 可以定义标签的跳转对象
如果定义JavaScript程序,有可能会受到超链接跳转的影响,执行JavaScript代码有误
超链接要写行内式,定义在 href 属性中
在 href 属性中 定义 JavaScript: ;
在 冒号 分号之间,定义 JavaScript代码
此时 就 不能实现 页面跳转了,如果需要实现页面跳转,需要通过 BOM 操作来实现
JavaScript:; 大小写,不区分,都行,只是我们习惯性的 J 和 S 大写
JavaScript 大小写随便
因为 JavaScript 是 href的属性值,会被理解为 html 程序的一部分
html代码是不区分大小写的
window.alert() 是要严格区分大小写的
虽然当前也被视为 href的属性值
但是 本质是 一个js 程序
JavaScript程序 会 严格区分大小写
 
-->
<A id="a1" href="hTTps://wWW.bAIdu.cOm" onclick= fun2()>我想去百度看看</a>
<br>//是可以跳转的点击后字体是黄色
<a href="jAvAscRipT: window.alert('我是定义的js程序弹出内容') ;" >我是标准的超链接行内式</a>//出现一个弹窗
<!-- 没有跳转对象的超链接,之前href的属性值写的是 #
执行效果是点击超链接,会跳转至页面的顶部
 
现在href的属性值,写的是 JavaScript:;
没有任何执行效果,不会有任何的跳转
-->
<a href="JavaScript:;">我就是随便写写的超链接</a>

<script>

function fun2(){
const oA = document.querySelector('#a1');
oA.style.color = 'orange';
}
</script>
</body>
</html>

JavaScript语法形式1行内式的更多相关文章

  1. 0008 CSS初识（行内式、内部样式表、外部样式表）

    typora-copy-images-to: media 第01阶段.前端基础.CSS初识 CSS层叠样式表 学习目标 理解 css的目的作用 css的三种引入方式 应用 css三种引用方式的书写 通 ...

  2. JavaScript--返回顶部方法:锚链接、行内式js写法、外链式、内嵌式

    返回网页顶部方法 一.锚链接 simpleDemo: <!DOCTYPE html> <html lang="en"> <head> <m ...

  3. js行内式遇到的一些问题 DOM对象和jq对象转换的问题

    这两天给后台页面做页面,我的工作比较简单,只需要写结构和样式就行了,写好之后,后端大哥用ajax重写页面加载数据,顺便给标签添加选中事件,做选中后变色的处理,但是却遇到一个问题,一直选不到触发事件这个 ...

  4. Angular 行内式依赖注入

    var app = angular.module('myApp', ['ng']); //创建一个自定义服务app.factory('$Debug', function () { return { d ...

  5. JavaScript的DOM_操作行内样式

    一.检测浏览器是否支持css CSS 作为(X)HTML 的辅助,可以增强页面的显示效果.但不是每个浏览器都能支持最新的 CSS 能力.CSS 的能力和 DOM 级别密切相关,所以我们有必要检测当前浏 ...

  6. HTML+CSS教程（四）选择器（id选择器，类选择器，标签选择器，子代选择器，后代选择器，组选择器，伪类选择器）/css引入页面的形式（行内样式、内嵌样式、外联样式）

    一.回顾内容 前端的三大组成(三大模块)    HTMl(超文本标记语言) 结构层    css(层叠样式表) 表现层:用来美化HTML结构    JS(Java script)(脚本语言) 行为层: ...

  7. JS——行内式注册事件

    html中行内调用function的时候,是通过window调用的function,所以打印this等于打印window,所以在使用行内注册事件时务必传入参数this <!DOCTYPE htm ...

  8. !important覆写css行内样式

    <div class="block"> <span style="font-weight: bold; color: red;">Hel ...

  9. 第48天学习打卡（HTML 行内元素和块元素 列表 表格 视频和音频 页面结构分析 iframe内联框架 表单语法 ）

    行内元素和块元素 块元素 ​ 无论内容多少,该元素独占一行 ​ (p.h1-h6) 行内元素 ​ 内容撑开宽度,左右都是行内元素的可以排在一行 ​ (a.strong.em...) 列表 什么是列表 ...

  10. md语法之行内代码和代码片续集

    md语法之行内代码和代码片 一行之内嵌入一小段代码, 简称行内代码. 其方法为: 用撇号把代码围起来. 比如: import numpy as ny就可以了. 代码片的方法: 三个连续的撇号+pyth ...

随机推荐

  1. LLM开源小工具(基于代码库快速学习/纯shell调用LLM灵活管理系统)

    随着AI的各种信息的发展,LLM各种模型不断涌现,作为一名IT人员不得不向前走,不断探索学习发现新知识. 随着学习,也了解到一些对于模型的调用,从而解决一些问题,或者对已有工具或应用的重写.如下是两个 ...

  2. Memory Error

    不久前,为了满足工作中日常的各种实验测试需求,终于按需求组装一台塔式的server T440.但是没有多久就出现些问题,以下大概是问题和现象简单描述: (1). 最开始时,没几天就出现自动重启的问题, ...

  3. MD5前端vue加密

    Vue 前端md5加密用户注册时将加密后的密码发送给后端存储当登陆的时候,再将加密后的密码和数据库中加密的密码相匹配.npm: https://www.npmjs.com/package/crypto ...

  4. 力扣9(java)-回文数（简单）

    题目: 给你一个整数 x ,如果 x 是一个回文整数,返回 true :否则,返回 false . 回文数是指正序(从左向右)和倒序(从右向左)读都是一样的整数. 例如,121 是回文,而 123 不 ...

  5. WPF 列表控件数据源绑定多个数据集合方法

    在 WPF 用的多的列表控件如 ListBox 或 ListView 等,本文告诉大家在这些列表控件上进行绑定多个数据集合来源的多个实现方法.如有一个显示动物列表的控件,需要绑定的数据来源是阿猫和阿狗 ...

  6. C++多态与虚拟：C++编译器对函数名的改编（Name Mangling）

    如果函数名称都相同(也就是被overloaded),编译器在面对你的函数唤起动作时,究竟是如何确定调用哪个函数实体呢?事实上,编译器把所有同名的overloaded functions视为不同的函数, ...

  7. Codeforces Round 934 2D/1B

    Link 场上思路出的最快的一题,但没调出来. 反着考虑全为回文串需满足哪些情况. 若 \(k = 1\),没有限制条件. 若 \(k = 2\),对于任意三个位置 _ _ _,先填 \(x\) \( ...

  8. SpringBoot连接redis报错:exception is io.lettuce.core.RedisException: java.io.IOException: 远程主机强迫关闭了一个现有的连接

    一.解决思路 (1).检查redis的配置是否正确 spring redis: host: localhost port: 6379 password: 123456 database: 0 time ...

  9. linux下安装来自github的package失败

    最近使用go来做web服务器,当然还是得使用框架,于是找了几个:beego.echo等,但是我在安装得时候总是出现这类报错 cannot find package "github.com/l ...

  10. C语言：卖鸭子问题---递归法实现

    1.一个人赶着鸭子去每个村庄卖,每经过一个村子卖去所赶鸭子的一半又一只.这样他经过了七个村子后还剩两只鸭子,问他出发时共赶多少只鸭子?经过每个村子卖出多少只鸭子? 代码: #include<st ...