pycharm连接git
flask
页面
前端页面=Tag+CSS+JS
Tag - 承载内容 - content
CSS - 页面显示 - display
- 内嵌样式表(通过标签的style属性设置样式,不推荐使用)
- 内部样式表(在head部分通过style标签插入CSS选择器)
JS - 交互行为 - behavior
浏览器中的JS有三个要素:
-
ECMAScript (ES) — 语法规范
-
BOM – Browser Object Model —浏览器对象模型 window内置对象
- location / history / screen / navigator - alert() / prompt() / confirm() / open() /close() - setTimeout() / setInterval()
-
DOM – Document Object Model --文档对象模型 document
- querySelector() / querySelectorAll() –
- createElement () -- 创建新标签 - appendChild() /insertBefore() -- 添加新标签 - removeChild() -- 删除标签 - textContent/innerHTML -- 修改标签内容 - style -- 修改标签样式
JS
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 点击触发函数 -->
<button onclick="sayHello()">确定</button>
<script>
//驼峰命名法(Camel Notation)
//命名变量和函数:第一个单词全小写,从第二个单词开始,每个单词的首字母大写
// 命名类:每个单词首字母大写
function sayHello(){
let name = window.prompt('请输入你的名字:')
window.alert('你好'+name)
}
for (let i=0;i<10;++i){
if (i%2==0){
document.write('<h1 style="color:red">helloWord</h1>')
}
else{
document.write('<h1 style="color:blue">helloWord</h1>')
}
}
document.write('<h1>hello</h1>')
</script>
</body>
</html>
document.write('<h1>hello</h1>')
</script>
</body>
</html>