HTML系
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } レイアウトを横並びにする この記事では、CSSを用いて、ホームページのレイアウトを横にする方…
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventL…
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventL…
jQuary,javascript学習4(jQueryのchangeと関数) ・目次 jQuary,javascript学習4(jQueryのchangeと関数) 1.目的 2.htmlの値の取得と値の出力方法 3.プログラムの作成(数値の取得と、計算結果の出力) 関連記事 1.目的 ・jQuaryのchangeについて記載する…
jQuary,javascript学習3(数値の取得と出力) ・目次 jQuary,javascript学習3(数値の取得と出力) 1.目的 2.htmlの値の取得と値の出力方法 3.プログラムの作成(数値の取得と、計算結果の出力) 関連記事 1.目的 ・jQuaryを使用し、htmlの数値を取得し、計…
jQuary,javascript学習2(id取得) ・目次 jQuary,javascript学習2(id取得) 1.目的 2.id及びclassの取得 3.プログラムの作成(idとclassのクリック) 4.プログラム説明 関連記事 1.目的 ・jQuaryを使用し、htmlのid及びclassを取得する方法について記載す…
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } javascriptの√(平方根)、π、2乗の計算 この記事では、javascriptの√計算、π計算、べき乗計算の…
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } javascriptの関数と関数式 この記事では、javascriptの関数と関数式について記載する。 1. 目的…
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } オペアンプ反転増幅回路、非反転増幅回路の自動計算 この記事では、反転増幅回路と非反転増幅回…
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } javascriptでHTMLの数値取得 この記事では、HTMLで数値を設定し、その設定した値をjavascript側…
window.onload = function () { let tes1 = document.getElementById("test1"); tes1.addEventListener("click",function(){ tes1.innerText = "タイトル" }) } javascriptでidの取得とaddEventListenerについて この記事では、javascriptでidを取得し、それ…
javascriptの導入、記載方法ついて この記事では、javascriptの導入、何が出来るかなどについて記載する。 1. 目的 ・javascriptの導入について理解する。(どこに書くかなど) 目次 javascriptの導入、記載方法ついて 1. 目的 2. javascriptとは 3.javascript…
HTMLのidとclassについて この記事では、HTMLのidとclassについて記載する。 1. 目的 ・HTMLで装飾する場合や、javascriptを使用する場合などに、idやclassがよく使われる。 このidとclassの意味、使い方について理解する。 目次 HTMLのidとclassについて 1.…
HTMLを装飾する方法、CSSの追加について この記事では、HTMLを装飾するCSSの追加する方法について記載する。 1. 目的 ・HTMLの装飾(文字の色の変更や、バックグランドの変更など)するための、CSSを使用する方法について記載する。 目次 HTMLを装飾する方法、…
HTMLのタグについて この記事では、HTMLの属性について記載する。 1. 目的 ・HTMLの属性について理解する。 目次 HTMLのタグについて 1. 目的 2. 属性とは 3.属性の使い方 3.プログラムの作成(属性付与で文字列を真ん中にする。) 関連記事 2. 属性とは ・HTM…
HTMLのタグについて この記事では、HTMLのタグについて記載する。 1. 目的 ・HTMLのタグについて理解する。 目次 HTMLのタグについて 1. 目的 2. タグとは 3.タグの種類 関連記事 2. タグとは ・タグは角括弧（< >）で囲まれ、開始タグと終了タグのペアで構…
HTMLでホームページのタブの名前設定 この記事では、下記2点の確認を行う。 ・HTMLでホームページを作成し、タイトル(タブの名前)を設定 ・pタグを使用して、段落を作成する。 1. 目的 ・HTMLでホームページの下記部分の設定を行う。 目次 HTMLでホームペー…
HTML,CSS,Javascript 環境設定 この記事では、HTML,CSS,Javascriptでホームページなどを作成する際の環境を用意する。 1. 目的 ・HTML,CSS,Javascriptでホームページなどを作成する為の、テキストエディタの導入をする。 また、その環境設定を行う。 これに…
ObnizとjQuaryでLED点灯/消灯 ・目次 ObnizとjQuaryでLED点灯/消灯 1.目的 2.動作説明 3.使用機器 4.ピン接続 5.接続回路図(DFplayerとobnizの接続部分) 6.プログラム作成 5.プログラム説明 関連記事 1.目的 ・obnizeを使用して、DFplayerとUART通信を…
ObnizとjQuaryでLED点灯/消灯 ・目次 ObnizとjQuaryでLED点灯/消灯 1.目的 2.obnizeとは 3.使用機器 4.プログラム作成 3.プログラム説明 4.動作画像 関連記事 1.目的 ・obnizeを使用して、LEDの点灯、消灯するプログラムを作成する。 obnizでLEDを光ら…
jQuaryの導入と入門 ・目次 jQuaryの導入と入門 1.jQuaryの導入 2.jQuaryでプログラム作成 3.プログラム説明 関連記事 1.jQuaryの導入 jQuaryのurlを取得し、ボタンを押したら[Hellow World]を表示する プログラムを作成する。 (1) jQuaryのダウンロー…
Javascriptメモ：文字の変更 クリックすると文字を変更するプログラム： 下記「文字1」をクリックすると、「変更しました」 「変更しました」をクリックすると、「文字1」 を表示する。 Target1 <html lang="ja"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> </meta></meta></meta></head></html>
JavascriptとCSSが使えることを確認する 動作： ・青い四角をクリックするとピンクの丸になる。 ・ピンクの丸をクリックすると青い四角に戻る。 .box{ width: 120px; height: 120px; background:skyblue; cursor: pointer; transition:0.8s; } .circle{ back…
