这次给大家带来JS的8个必须注意的基础知识，JS的8个必须注意的基础知识注意事项有哪些，下面就是实战案例，一起来看一下。
1 JS 中修改元素的类名: 可以通过className修改,不能使用class
function toRed() { var tobox = document.getElementById('box1');
tobox.className = 'tmpBox';
}2 函数传参
<html lang="en"><head>
<meta charset="UTF-8">
<title>02-函数传参数</title>
<style>
#div1{width: 200px; height: 200px; border: 1px solid #000;} </style>
<script>
function setColor(color) { var oDiv = document.getElementById('div1');
oDiv.style.backgroundColor = color;
} </script></head><body><input type="button" value="变绿" onclick="setColor('green')"><input type="button" value="变黄" onclick="setColor('yellow')"><input type="button" value="变黑" onclick="setColor('black')"><div id="div1"></div></body></html>3修改属性的第二种方法:(3499910bf9dac5ae3c52d5ede7383485要修改的属性不固定时使用5db79b134e9f6b82c0b36e0489ee08ed)
可以通过 oDiv.style[属性名字] = value;来动态修改属性和值
//括号里放的是变量
function setStyle(propertyName,value) {
var oDiv = document.getElementById('div1');
oDiv.style[propertyName] = value;
}<html lang="en"><head>
<meta charset="UTF-8">
<title></title>
<style>
#div1{ width: 100px;height: 100px;border: 1px solid #000;background-color: skyblue;
} </style>
<script>
function setStyle(propertyName,value) { var oDiv = document.getElementById('div1');
oDiv.style[propertyName] = value;
} </script></head><body><input type="button" value="变高" onclick="setStyle('height','200px')"><input type="button" value="变宽" onclick="setStyle('width','200px')"><input type="button" value="变红" onclick="setStyle('background','red')"><div id="div1"></div></body></html>4.style和className的区别
元素.style.属性 = xxx;是修改的行间(行内)样式,它的优先级比较高 !!! 例如:oDiv.style.backgroundColor = 'red';
className : 可以通过指定的类名,去找到对应的样式;
但是如果使用了style之后,再使用className指定样式,就会没有效果!!!!
注意:要么都是用style设置样式,要么单独使用className指定样式,不可混合使用,会有未知的错误发生!
5.提取行间事件
window.onload 页面加载完成时才执行
行为、样式、结构三者分离: JS CSS HTML 分离
提取事件
为元素添加事件
<html lang="en"><head>
<meta charset="UTF-8">
<title>05-提取行间事件</title>
<script>
//window.onload 页面加载完成时才执行
window.onload = function () { var oBtn = document.getElementById('btn1'); //给元素添加事件
oBtn.onclick = function () { //匿名函数
alert('我是打酱油的');
};
} </script></head><body><input id="btn1" type="button" value="按钮"></body></html>6.JS从父元素获取子元素
从下面代码中获取到input
<div id="box1">
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br>
<input type="checkbox"> <br></div>放下如下:
window.onload =function (){ var oDiv = document.getElementById('box1'); //现获取父元素div
var inputs = oDiv.getElementsByTagName('input'); //再通过div获取到里面所有的input}7. innerHTML
用于设置容器标签的内容,可以是文字,也可以是 HTML(标签)。
<html lang="en"><head>
<meta charset="UTF-8">
<title>08-innerHTML</title>
<style>
.content{ width: 200px; height: 200px; border: 1px solid #000;
} </style>
<script>
window.onload = function () { var oText = document.getElementById('textField'); var oBtn = document.getElementById('button'); var oContent = document.getElementById('div-content');
oBtn.onclick = function () {
oContent.innerHTML = oText.value;//可以往里放文字,标签等
}
} </script></head><body><input type="text" id="textField"><input type="button" value="点击" id="button"><div class="content" id="div-content"></div></body></html>8.字符串的拼接:
var str = '我叫小明'+12+'岁'+168+'2017'; >>> 结果:我叫小明12岁1682017var num = '9+6等于'+(9+6); >>> 结果: 9 + 6 等于 15
相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
推荐阅读：
Atas ialah kandungan terperinci JS的8个必须注意的基础知识. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Python vs JavaScript: Analisis Perbandingan untuk PemajuMay 09, 2025 am 12:22 AMPerbezaan utama antara Python dan JavaScript ialah sistem jenis dan senario aplikasi. 1. Python menggunakan jenis dinamik, sesuai untuk pengkomputeran saintifik dan analisis data. 2. JavaScript mengamalkan jenis yang lemah dan digunakan secara meluas dalam pembangunan depan dan stack penuh. Kedua -duanya mempunyai kelebihan mereka sendiri dalam pengaturcaraan dan pengoptimuman prestasi yang tidak segerak, dan harus diputuskan mengikut keperluan projek ketika memilih.
Python vs JavaScript: Memilih alat yang sesuai untuk pekerjaanMay 08, 2025 am 12:10 AMSama ada untuk memilih Python atau JavaScript bergantung kepada jenis projek: 1) Pilih Python untuk Sains Data dan Tugas Automasi; 2) Pilih JavaScript untuk pembangunan front-end dan penuh. Python disukai untuk perpustakaannya yang kuat dalam pemprosesan data dan automasi, sementara JavaScript sangat diperlukan untuk kelebihannya dalam interaksi web dan pembangunan stack penuh.
Python dan javascript: memahami kekuatan masing -masingMay 06, 2025 am 12:15 AMPython dan JavaScript masing -masing mempunyai kelebihan mereka sendiri, dan pilihan bergantung kepada keperluan projek dan keutamaan peribadi. 1. Python mudah dipelajari, dengan sintaks ringkas, sesuai untuk sains data dan pembangunan back-end, tetapi mempunyai kelajuan pelaksanaan yang perlahan. 2. JavaScript berada di mana-mana dalam pembangunan front-end dan mempunyai keupayaan pengaturcaraan tak segerak yang kuat. Node.js menjadikannya sesuai untuk pembangunan penuh, tetapi sintaks mungkin rumit dan rawan kesilapan.
Inti JavaScript: Adakah ia dibina di atas C atau C?May 05, 2025 am 12:07 AMJavascriptisnotbuiltoncorc; it'saninterpretedlanguagethatrunsonenginesoftenwritteninc .1) javascriptwasdesignedasalightweight, interpratedlanguageforwebbrowsers.2)
Aplikasi JavaScript: Dari Front-End ke Back-EndMay 04, 2025 am 12:12 AMJavaScript boleh digunakan untuk pembangunan front-end dan back-end. Bahagian depan meningkatkan pengalaman pengguna melalui operasi DOM, dan back-end mengendalikan tugas pelayan melalui Node.js. 1. Contoh front-end: Tukar kandungan teks laman web. 2. Contoh backend: Buat pelayan Node.js.
Python vs JavaScript: Bahasa mana yang harus anda pelajari?May 03, 2025 am 12:10 AMMemilih Python atau JavaScript harus berdasarkan perkembangan kerjaya, keluk pembelajaran dan ekosistem: 1) Pembangunan Kerjaya: Python sesuai untuk sains data dan pembangunan back-end, sementara JavaScript sesuai untuk pembangunan depan dan penuh. 2) Kurva Pembelajaran: Sintaks Python adalah ringkas dan sesuai untuk pemula; Sintaks JavaScript adalah fleksibel. 3) Ekosistem: Python mempunyai perpustakaan pengkomputeran saintifik yang kaya, dan JavaScript mempunyai rangka kerja front-end yang kuat.
Rangka Kerja JavaScript: Menguasai Pembangunan Web ModenMay 02, 2025 am 12:04 AMKuasa rangka kerja JavaScript terletak pada pembangunan yang memudahkan, meningkatkan pengalaman pengguna dan prestasi aplikasi. Apabila memilih rangka kerja, pertimbangkan: 1.
Hubungan antara JavaScript, C, dan penyemak imbasMay 01, 2025 am 12:06 AMPengenalan Saya tahu anda mungkin merasa pelik, apa sebenarnya yang perlu dilakukan oleh JavaScript, C dan penyemak imbas? Mereka seolah -olah tidak berkaitan, tetapi sebenarnya, mereka memainkan peranan yang sangat penting dalam pembangunan web moden. Hari ini kita akan membincangkan hubungan rapat antara ketiga -tiga ini. Melalui artikel ini, anda akan mempelajari bagaimana JavaScript berjalan dalam penyemak imbas, peranan C dalam enjin pelayar, dan bagaimana mereka bekerjasama untuk memacu rendering dan interaksi laman web. Kita semua tahu hubungan antara JavaScript dan penyemak imbas. JavaScript adalah bahasa utama pembangunan front-end. Ia berjalan secara langsung di penyemak imbas, menjadikan laman web jelas dan menarik. Adakah anda pernah tertanya -tanya mengapa Javascr
Alat AI Hot
Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik
AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.
Undress AI Tool
Gambar buka pakaian secara percuma
Clothoff.io
Penyingkiran pakaian AI
Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!
Artikel Panas
Alat panas
VSCode Windows 64-bit Muat Turun
Editor IDE percuma dan berkuasa yang dilancarkan oleh Microsoft
Versi Mac WebStorm
Alat pembangunan JavaScript yang berguna
mPDF
mPDF ialah perpustakaan PHP yang boleh menjana fail PDF daripada HTML yang dikodkan UTF-8. Pengarang asal, Ian Back, menulis mPDF untuk mengeluarkan fail PDF "dengan cepat" dari tapak webnya dan mengendalikan bahasa yang berbeza. Ia lebih perlahan dan menghasilkan fail yang lebih besar apabila menggunakan fon Unicode daripada skrip asal seperti HTML2FPDF, tetapi menyokong gaya CSS dsb. dan mempunyai banyak peningkatan. Menyokong hampir semua bahasa, termasuk RTL (Arab dan Ibrani) dan CJK (Cina, Jepun dan Korea). Menyokong elemen peringkat blok bersarang (seperti P, DIV),
Penyesuai Pelayan SAP NetWeaver untuk Eclipse
Integrasikan Eclipse dengan pelayan aplikasi SAP NetWeaver.
Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma
