Translate

BTemplates.com

Powered by Blogger.

2019年7月28日日曜日

2019-07-26 07-27 到達点メモ


.text()を行う際にDOM操作をする際にそもそもタグの指定が間違っていないか
確かめたい時は.html()でやると
テキストデータを取得する方法としては間違っていないが
タグの指定は間違っていないかどうかが分かる。

例えば、以下の様なテーブル構造があったとする

<table class="test_tag nononaga_tag">
  <tr>
    <th>TEST</th>
    <td><a rel="nofollow" target="_blank" href="https://www.nononagainfo.com/">https://www.nononagainfo.com/</a></td>
  </tr>
</table>
この際に、欲しいデータが、tdタグのURLアドレスだった場合、
$ ('table.test_tag').text ();
もしくは、
$ ('table.nononaga_tag').text ();
では取得できない。

この場合、正しいやり方は以下のどちらかである。
$ ('table.test_tag td').text ();
$ ('table.nononaga_tag td').text ();
*理由はよくわかっていないが、 ('table.test_tag table.nononaga_tag  td').text ();
では取得できない。何か指定方法が間違っているのかもしれない。

大体目標の作業は終わったと思う。
これで作業がグッと楽になるはず。

例えば、以下の構造があったとして
ノノナガというデータを取りたいとする。
<div class="job_type">
  <div class="programmer">
    <span class="user_name">
    ノノナガ
    </span>
  </div>
</div>

その場合は、以下のようにすればよい
$('.job_type').find('.user_name')

参考サイト:jQueryで子要素を取得する方法:children(), find()
https://uxmilk.jp/10873

jQueryとJavaScriptがごっちゃになってしまってるので気を付けないといけない
.find()はjQueryの話。

タグ内に不要な改行が入っており、且つそれがブラウザ上で反映されていないので
その表示に近づけたい場合は、以下のようにやればよい。

◆htmlでのデータ
<p>


あいうえお
</p>


◆ブラウザでの表示
あいうえお

var copyHtml = '<p>' + $ ('.aiueo').html ().replace (/\n/g, '') + '</p>';
var copyText = $ (copyHtml).text ();
console.log (copyText);

一旦HTMLデータを出力し、そこでreplaceで改行(\nのことで<br>のではない)
そのあと、タグが消えるのでhtmlに戻すためにpタグで囲んでやる

他のごみデータの削除もこれで対処できるかもしれない。

今日はここまで。

2019年7月26日金曜日

2019-07-23、07-24、07-25 到達点メモ


DOM操作とjQueryとJavaScriptがごっちゃになっていて分かんねぇぇえええ

function内で他のDOMの値が取れないのは何でなんだ・・・。
.text()じゃなかったからだった・・・。(*ずっと.textでやっており、後ろの括弧が無かった)

クリップボードにコピーするのは以下のサイトが役に立ったというかコピペした。

[jQuery] テキストエリアの内容をクリップボードにコピーするボタンを設置したい
https://migi.me/jquery/copy-clipboard/

思った以上に手間取った。
正直、未だに分かっていないことも多い・・・。

最終的に必要なところを全部ボタン化してコピーしたいのだが
今のところh1タグのところしか作れていない・・・。

あと、特定のURLときのみ機能するようにしないと調べ物しながらだと邪魔すぎる・・・。

2019-07-24

URLの指定は普通に楽だった。
urlを取得する構文を書き、document.URL.match で一部分の重要な箇所が一致するかを見れば普通に場合別けができた。

参考サイト:jQueryでURLを取得してページごとに条件分岐させる
https://designsupply-web.com/knowledgeside/1592/

データを取得する際に、タグとかの状態でhtmlデータを取得したい場合は
単純に.html()で取得できる。
.text()だと、<br>の改行が認識されないので、自力で変換してやる必要がある

参考サイト:【jQuery】textメソッド改行入らない
https://teratail.com/questions/36078

なお、JavaScriptで変換する場合は.replaceを使う必要がある
また、条件を満たすものを全部変換したい場合は、正規表現を使う必要がある。

参考サイト:特定の文字列を全て置換する[Javascript]
https://qiita.com/DecoratedKnight/items/103ab57431b6c448e535

参考サイト:基本的な正規表現一覧
https://murashun.jp/blog/20190215-01.html

参考サイト:エスケープ, 特殊文字
https://ja.javascript.info/regexp-escaping

また引っかかったところとしてスラッシュとバックスラッシュがごっちゃになってしまい
本来、スラッシュ(/)をやりたかったのをバックスラッシュ(\)と勘違いしてしまい
\\ と入力して袋小路に入っていた。
正しいやり方は \/ である。

DOMの指定の仕方で、仮に<h3 class="h3_hoghoge">を指定しようと思ったが、他のクラスにも同じ名前があったので、<section class="sec1234_hoghoge"><h3 class="h3_hoghoge">を指定したいとする。


その場合は、以下の様な指定をすればよい
*正しい例
$ ('section.sec1234_hoghoge>h3.h3_hoghoge')

無論、以下の様な指定はできない
*ダメな例
$ ('section.sec1234_hoghoge').$('h3.h3_hoghoge')

jQueryのセレクタメモ(リンク先は階層関係の指定の部分からになっている)
https://qiita.com/Thought_Nibbler/items/5d4fc40a4d4325128b24#%E9%9A%8E%E5%B1%A4%E9%96%A2%E4%BF%82%E3%81%AE%E6%8C%87%E5%AE%9A

その他
たまにクラス名で
<div class="hoge momomo">
という風にスペースで区切ってあるものがあるが
これは、クラス名が二つになっており、"hoge momomo"というクラス名のわけではない。
正しくは、"hoge"と"momomo"の二つである

参考サイト
スペースを含んだクラス名を jquery で指定できない
https://ja.stackoverflow.com/questions/22510/%E3%82%B9%E3%83%9A%E3%83%BC%E3%82%B9%E3%82%92%E5%90%AB%E3%82%93%E3%81%A0%E3%82%AF%E3%83%A9%E3%82%B9%E5%90%8D%E3%82%92-jquery-%E3%81%A7%E6%8C%87%E5%AE%9A%E3%81%A7%E3%81%8D%E3%81%AA%E3%81%84

2019-07-25
本当に皆自由に書くんだなぁ・・・。
ブラウザで表示される内容と実データの中身に乖離がありすぎるのですが、それは・・・。

一番簡単なのは、一度htmlデータで出力した後に
それを再度htmlデータとして取り込みをそれを.text()で出力するのが良い
ただし、ブラウザで表示されるのと実データは違うので(CSSなどで表示に変化が出ているのだろうか・・・?)
実データがアレだと結局手直しが必要になる。

正規表現で、下のように赤字の部分だけ変えたくない場合とかがある
    /<div>テスト<\/div>\n(.*?)<\/th>\n(.*?)<td/,

その時は以下のように書けばよい
'<div>テスト<\/div>\n$1<\/th>\n$2<td class="test_class"'

参考サイト
文字列の一部だけを変更したい
https://hodade.com/seiki/page.php?r_ichibu

日付や年数の加算減算をしたい場合は、
.setDate()をすればよい。

あと、紛らわしい事として、
*.getMonth()で取得できる数値は0~11になっている
*年数を取得したい場合は,.getFullYear()
がある
なお、文字列から日付に変換したい場合は
var date = new Date ('2019-07-25');
でも可能

参考サイト
【JavaScript】日付処理
https://qiita.com/kazu56/items/cca24cfdca4553269cab
JavaScript の Date は罠が多すぎる
https://qiita.com/labocho/items/5fbaa0491b67221419b4
javascriptで日付(月・日)を加算(減算)してみた
http://shoprev.hatenablog.com/entry/2014/09/18/223316

X番目のthのタグを指定するには
th:nth-child(X)とやればよい
一番最初の番号は1。0ではない

jQueryでTABLE要素の操作
https://rfs.jp/sb/javascript/js-lab/jquery-table.html

末尾の文字を削除する場合は
'aaaaaf'.slice( 0, -1 ) ;
とやればよい

先頭、末尾の文字を削除する方法
https://lab.syncer.jp/Web/JavaScript/Snippet/5/

タグの指定が間違っていないはず?なのだが上手く行かない
元のHTMLの構造がおかしいのか、それとも、なんか指定が間違っているのか・・・?

目標の大体は解決できたので今日はここまで。


2019年7月18日木曜日

2019-05-11、05-24、07-18 到達点メモ


Android App Bundleについて調べる。

端折った大雑把な解釈だが、apkだと全部の端末に対応しないといけないので
余分なデータが含まれてしまう。
そこでGooglePlay側で必要なデータだけコンパイルするようにすることで
容量が減る。という解釈だと思っている。


Android App Bundle でアプリサイズを削減
https://rakuishi.com/archives/android-app-bundle/

Android App Bundle のすゝめ
https://note.mu/numero_dev/n/n36ccca859ae5

Android アプリバンドル (Android App Bundle) について学んだ
https://vividcode.hatenablog.com/entry/android/app-bundle


というかちゃんと調べたら公式ドキュメントの方がありましたね・・・。
About Android App Bundles(Android Developers)
https://developer.android.com/guide/app-bundle/

Android App Bundle でアプリや機能をオンデマンド配信する(GooglePlayConsoleヘルプ)
https://support.google.com/googleplay/android-developer/answer/9006925


あまりに久しぶりなので色々アップデートしたのが
またなんか動作が変わってる・・・。

DeployGate関連
Gradle SyncでgetPackageApplication()の警告を解決した
https://firespeed.org/diary.php?diary=kenz-1911

コンパイルに失敗したのでjreからjdkに変更
  implementation "org.jetbrains.kotlin:kotlin-stdlib-jre7:$kotlin_version"

  implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version"

というかAndroid App Bundleの対処をする前に動作確認をして
一旦これであげようかなぁ・・・。


GIMPを使ってロゴ消しなどをやりたい場合。

Windowの場合は、以下のサイトに移動してプラグインをダウロードする
https://github.com/pixlsus/registry.gimp.org_static/blob/master/registry.gimp.org/files/Resynthesizer_v1.0-i686.zip

C:\Users\user名\.gimp-2.8\plug-insに
ReadMe以外の解答したファイルを全て移動させる。

消したい部分を少し大きめに囲んだうえで
フィルター → 強調 → Heal selectionを選択し行うと
少し時間がかかるが奇麗な感じに修正してくれる。
ギリギリの大きさで選択すると、変な線が残る場合がある。

軽くしかReadMeを読んでいないのだが、Pythonをあらかじめ入れておく必要があるらしい。
自分は既にPythonを入れているので其処の検証はしていない。


参考サイト
https://github.com/bootchk/resynthesizer
https://github.com/pixlsus/registry.gimp.org_static/blob/master/registry.gimp.org/files/Resynthesizer_v1.0-i686.zip
GIMPで画像の一部を削除する方法!Ver2.10でのスマート消去の使い方
【GIMP】画像の一部をキレイに消す方法


引っ越しとか色々あって凄くこの手のページを開くのが久しぶりすぎる・・・。

ちょっと内職の作業がクソ面倒なのでエクステンションで如何にかできそうなので
前々からやろうやろうと思っていた調査を始めることにした。

目標としては、
・開いているページURLをボタンでコピーできるようにする
・特定の情報をボタンでコピーできるようにする(のちのちは、一部の情報は加工した状態のものをコピーできるようにしたい。)

久しぶりすぎて大分色々忘れているのだが、おそらくDOMの操作をすればいけそう

以下のサイトが進める上で参考になりそう。

Chromeブラウザの拡張機能を作ってみたい初心者向けに開発方法を紹介!【サンプルあり】
https://qiita.com/guru_taka/items/37a90766f4f845e963e5
Extend the Browser(公式ドキュメント)
https://developer.chrome.com/extensions


というかDOMの書き替えは、どちらかというとJavaScriptとかJQueryの領域だわ
普通にボタンの追加とか、要素の取得とかはそっちで行けそうな気がする。

参考サイト
jQueryでDOM操作する際の基本記述を勉強し直してみたよ。
http://programmerbox.com/2013-09-26_jquery_dom_basic_description/

特定のURLのときだけ動かすみたいなことはmanifest.jsonでやるっぽいので
それを踏まえた上で如何にかできそう

何時まで経っても更新しないのはあれなので今日はここまで